I made a mobile UI for a game that has a dash, sprint, and slide button around the jump button. I have made it so that they scale to different mobile devices for the most part, but the buttons even though are set to scale, keep either shifting upwards or into the jump button depending on device. So I’m wondering if there is a way to either program the buttons to stay in position for all devices, tether the buttons to the jump button for each device, or if there is something I have missed that should of also been done?
Things I have tried:
Set size and position have been converted to scale for all elements, anchor point set to 0.5, 0.5 for all element and UIAspectRatioConstrant has been placed, and placing everything into a frame. See images below:
Try using offest (instead of scale) for the size. If you still want to use scale - use UserInputService to scale it using a script:
local uis = game:GetService("UserInputService")
local button1 = script.Parent.button1 -- Locations of the buttons
local button2 = script.Parent.button2
local button3 = script.Parent.button3
local originalsize = UDim2.new(0.05, 0, 0.05, 0) -- Change it to the original size of the buttons
local biggersize = UDim2.new(0.08, 0, 0.08, 0) -- Change it to a bigger size for the buttons
if uis.TouchEnabled and uis.KeyboardEnabled == false then -- detect mobile phones and tablets
button1.Size = biggersize -- Change the size of the buttons
button2.Size = biggersize
button3.Size = biggersize
end
This script will detect devices with touch-screen, such as mobile phones and tablets, and make the buttons bigger. It will not make the buttons bigger on laptops with touchscreen, as it checks if uis.KeyboardEnabled is false.
Tip: use this technique only if offest creates very large buttons on mobile and very small on desktop
You could remove the default jump button and create a custom one so it will be resized along your other buttons.
Also, you can use a UIGridLayout set it to bottom-right for the container frame so it ensure to keep the frame (and buttons) to the botton right corner of the screen and it do not get moved to the left on larger screen size.
The solution ended up being, basically using a script that puts the buttons to scale and position based on the size and position of the jump button from my understanding (had help from someone to resolve it)
