UI Aspect ratio Constraint issues

Help and Feedback Art Design Support
#1

You can write your topic however you want, but you need to answer these questions:

  1. What do you want to achieve? Keep it simple and clear!
    I am making a health & exp bar. I added an aspect ratio constraint to keep the dimensions consistent across all screens. The issue is that a gap comes between the health bar and exp bar every time i go on a different device

healthBar1
^Normally on my screen

healthBarNotGood
healthBarNotGood1100×579 17 KB

^When I check it out on an ipad. There is a big gap between the health and exp bar

My Workspace:
healthExpWorkspace

I went on the route of putting everything in a singular frame and setting the parent frame transparency to 0. But just for knowledge, would you all know other ways to fix this?

1 Like
#2

I have the solution,

playerIsMobile = game:GetService('UserInputService').TouchEnabled

If playerIsMobile == true then
    -- Set the frames position for mobile players, 
end
#3

You can lock the aspect constraint to the height… under DominantAxis pick the Y axis.

#4

¿What about touch laptops? Those devices will be detected also.

#5

Oops, didn’t think about it. Hold on I’m gonna modify it!

playerIsMobile = game:GetService('UserInputService').TouchMoved or game:GetService('UserInputService').TouchTap

if playerIsMobile == true then
	-- Set the frames position for mobile players, 
end

I dont know if on touch laptops, players are able to move with a JoyCon or not.

1 Like
#6

is the position on pixels it needs to be on scale and use anchor point to 0.5,0.5
and size also needs to be on scale if the sizes are also broken

#7

A gap is still left in between when i change devices

#8

Wouldn’t the problem still occur to users who have wide monitor displays?

#9

Use Anchor Points then, this should keep them where they are.