How to position mobilebuttons relative to screensize?

Help and Feedback Scripting Support
1

I’ve recently added mobile buttons to my game and i’d like to know how I can make the buttons positioned the same across all devices, This is what i currently have:

1301×631 378 KB

1314×632 464 KB

(2 seperate devices)
I am using contextactionservice’s buttons to acheive this

1 Like
3

I’m going to have to fit in another button so i don’t know about having two buttons at the bottom,
(Could mess with the thumb-reach on bigger devices)

1311×633 413 KB

This is the desired layout if possible

4

Have you tried locating the custom buttons relative to the position of the jump buttons?

5

No clue how to do that, I didn’t think about it because i’ve noticed that the udim scale positioning on the custom buttons aren’t relative to the screen but relative to the area of the jump button?

6

Use the scale property of Position rather than offset

7

Yeah, I know, but how would i make it relative to the jump button? How would i implement it into my current code?

local plr = game.Players.LocalPlayer

local grabbing = false

local GrabModule = require(script.Parent.GrabItem)

local ContextAction = game:GetService("ContextActionService")



local function DropItem()
	GrabModule:ItemDrop()
	ContextAction:UnbindAction("Drop")
	ContextAction:UnbindAction("Throw")
	grabbing = false
end

local function ThrowItem()
	GrabModule:ItemThrow()
	ContextAction:UnbindAction("Drop")
	ContextAction:UnbindAction("Throw")
	grabbing = false
end

local function GrabItem()
	GrabModule:ItemGrab()
	ContextAction:UnbindAction("Grab")
	grabbing = true
	ContextAction:BindAction("Drop", DropItem, true)
	ContextAction:BindAction("Throw", ThrowItem, true)
	ContextAction:SetTitle("Drop", "Drop")
	ContextAction:SetTitle("Throw", "Throw")
	
	ContextAction:SetPosition("Drop", UDim2.new(0.6,0,0.2,0))
	ContextAction:SetPosition("Throw", UDim2.new(0.2,0,0.6,0))
end

function MobileSupport:GrabAt(Condition, Unbind)
	
	if Condition == true then
		if grabbing == false then
			ContextAction:BindAction("Grab", GrabItem, true)
			ContextAction:SetTitle("Grab", "Grab")
			ContextAction:SetPosition("Grab", UDim2.new(0.2,0,0.6,0))
		end
	else
		ContextAction:UnbindAction("Grab")
	end
	
	if Unbind == true and grabbing == true then
		ContextAction:UnbindAllActions()
		grabbing = false
	end
end
8

You should be using offset for this, scale is fit to the screensize whilst offset is not. Try doing something such as UDim2.new(0, 100, 0, 100)

9

Say i use offset instead of scale, Then would i not have to make seperate offset values for each type of device display? Cause say on a small phone 100 pixels offset will be alot while on an ipad pro, it won’t be enough.

https://gyazo.com/b4ed919563fb58ca9b90b18556c2a790.png

https://gyazo.com/2b1253e81f35228ceabc3d9dcff8203f.png

This is with your suggestion.

10

You can use this plugin it does it for you: https://www.roblox.com/library/150152826/Gui-Rescaler

11

Hence a plugin won’t work as I am essentially creating the buttons in a script.