Scrolling Frame Children not scaling for other devices

Help and Feedback Scripting Support
#1

I have a scrolling frame within a main frame, the scrolling frame contains smaller frames which contain buttons, text boxes, text labels etc.
image

I used a plugin called AutoScale Lite to scale my UI for other devices,
image
Issue:
I use the ‘scale’ option so the Ui can scale correctly for all screen resolutions,
although it seems children of the scrolling frame are not scaling correctly.

PC (Correct Scaling)
image

Mobile (Incorrect scaling)
image

I don’t have a super strong understanding on how UI works, although I understand scale and offset. However I can’t seem to find a solid solution.

2 Likes
Children of a scrolling frame do not scale to match device resolutions
#3

Are you selecting all descendants of the scrolling frame before pressing scale?

#4

I have selected each descendant one by one and have selected them all at once before scaling. None seem to work.

#5

Every UI element inside the scrolling frame is scaled using the plugin, including the textboxes, buttons, etc.

#6

Could be an issue with your UIListLayout, are you using scale for that as well?

#7

I don’t think you can use scale on UI List layouts, tried anyway and nothing happens.

#8

Try setting the ScrollingFrame AutomaticSize property to Y or try the other ones

#9

Neither seem to do anything, the option were X, Y and XY, tried all and nothing worked.

1 Like
#10

You can.ㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤ

#11

You want to scale all the children GUI inside of the frame seperately, I would reccomend not using the plugin, and do it manually. Just go the the properties of the UI you want to scale, go the size, and then change the size to {0.1, 0}{0.1,0}. After that, you can then scale it to your desired size. This is because the roblox GUIs are automatically scaled by offset. You do NOT want to use offset if you eant optimised GUIs.

I hope this helped.

#12

Tried what you said, Kind of works. I can see the textlabels and frames working fine, although I notice the textboxes and text buttons are very off centered.

Mobile:
image
Pc:
image
All Sizes for Elements:
Frame:
image
Button:
image
Text Label:
image
TextBox:
image

#13

When scaling a UI List layout it will only change the padding of an UI element. I am trying to change the size of elements, not their padding.

#14

Use a UIListLayout instead, I don’t see why you wouldn’t be able to use that in this context.

#15

Im not sure if this will work, but try to do that with position as well.

#16

I am using a UiListLayout, and as previously mentioned you can only scale padding.

#17

I meant to say UIGridLayout, either way I’m not sure why you are using this on a settings ui it seems pointless you could just manually change the spacing to make them even.

#18

image
Upon scaling the cell size of a UIGridLayout this is what happens. The frames work but the textboxes and textbuttons are off centered. Every descendent is scaled.
image

#19

Bumping to see if anything has been figured out regarding this post.

#20

Use the Add Constraint feature.

#21

So I found a fix, when you use the AutoScaleLite plugin and Click on Add Constraint a UIAspectRatioConstraint should be added to your selected Instance. Then just change the AspectType to ScaleWithParentSize.

5 Likes