Hello, I have took a 1 to 2 year break from roblox, I am wondering how to properly globally scale for each device so the G.U.I Text/images/button etc arent off the screen for someone on for instance a mobile phone. How do you accomplish this? I first spawn a frame for instance make its size 0,0 then put the U.I property to make it globally scale but it does not work for me, am I using it wrongly? Or is there a better method, thank you.
Use scale instead of offset for the position and size.
1 Like
Thank you i will test this right away
What’s the problem exactly? Are you trying to make the lighter “BETA Sword Pack” section scale to fill the rest of the “Gamepass Shop” holder?
1 Like
My problem is with all the U.I i have the U.I displays very differently across all devices making the market share for the game very limited
Look into beginner UI tutorials, they will give you the foundation. What I need to explain is already done there. As aforementioned, you need to use scale.
1 Like
Yes I am aware you want to make your UI flexible to work across different screen sizes, I’m specifically asking what you want the UI in your screenshot to look like so that I can help suggest a solution 
When implementing UI, you need to properly use size/position, set AnchorPoints and utilise UI constraints. The most important thing to understand is that the Position and Size properties of all UI objects are UDim2 types, which is like a Vector2 but with two UDims. A UDim has two values:
- Scale (Ratio / percentage of the parent)
- Offset (Exact pixels)
If you put a Frame directly into a ScreenGui and set the Position → X → Scale to 0.5, the Frame will be positioned halfway across the screen, at the pivot point on its top left corner. It’s important to use Scale since not everyone has the same screen size, so if you only use Offset, your UI may appear too far off the screen. You CAN use Offset, but for small adjustments in combination with Scale.
1 Like
Ah so your text is going outside of the description box, and the price information is also missing (I’m assuming that is hidden underneath the image.)
For the image thumbnail, since it appears to be too large and covering the text, ensure that it is parented to the same Frame as the price TextLabels. Then, adjust the position & size using the scale property.
For the text list, ensure that they are all parented inside the darker box that holds the product description. You can insert a constraint called UIListLayout inside this same darker box where all the textlabels are kept - this automatically positions all of your text labels next to each other. By default it should be set to Vertical which is what you want. Adjust the Padding to space them further apart. Then, you can adjust the sizes of the text labels in case they are too large to fit!
1 Like
Thank you so much you are a live saver!
1 Like
This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.