Why does my UI grid fit improperly whenever I switch screen types?

[diamondcheesefries]

https://gyazo.com/5d4e9ee3b37a482bdee333671e58494f

I’ve been trying to get into the loop with UI but one hurdle I cannot understand is when the options inside of a grid layout UI are displaced.

Ignoring the back/arrow/category buttons, inside of the actual box are the options, and I want them to fit properly to each person’s screen. Those options are controlled by a UI grid layout. Is there any way to fit them properly or at least make them fit a little better?

[Developer6786 (Nicholas)]

It is because of UI scaling. You must use plugins to properly scale your GUI elements.

Here is a post with the one that I use and instructions:

[Plugin] AutoScale Lite for GUIs - Scale your UI

[AutoScale Lite Banenr] Overview The plugin has two main functions. Converting a UI element’s size/position to Scale or Offset, and the auto scaling feature. The Add Constraint feature makes use of the UIAspectRatioConstraint which ensures that your UI retains it’s size on all screen sizes. You can add this constraint to your UI manually but my plugin does the calculating of the AspectRatio property by dividing the AbsoluteSizes so you don’t have to! [image] How do I use it hmmmmm? Firs…

[zilibobi (Checkmate)]

2 things that I see, you are using UIGridLayout. This constraint is not scaling UI objects (you have to make a script to change offset values and make them scale (scale values for this constraint are sometimes broken)). Instead you could use UIListLayout, you just have to change some properties based on where you want your objects to be. The second thing is that you need to use UIAspectRatioConstraints for your images, they will make sure that all of your UI objects are the same aspect ratio on all screens based on your CURRENT aspect ratio. Also make sure that all size values are in Scale value. You can check out my plugin that makes everything easier

[V. 1.2.1] UI Tools - The only UI plugin you need

Moderated post, please move to the new post

[epochzx (epoch)]

You are simply using Offset rather than Scale for the grid’s CellSize and Padding properties. These properties function the same way as a frame’s size or position.

@Developer6786 ZacByte’s plugin does not convert utility UI objects (list layouts, grid layouts, etc).

@zilibobi No scripting for converting Offset to scale is needed, there is also no point in recommending UIListLayout as they both function the same way; exception being grids allow you to do as the name suggests and grid if you need to or face space issues.
I actually do not believe he lacks aspect ratio constraints, as his elements do not stretch. The main issue is his grid layout properties.

You just spewed out generic scaling information to him that is not relevant to his issue whatsoever, please re-evaluate the information you give out in the future.

[diamondcheesefries]

I have this plugin and have utilized it already. I believe all of the buttons within the grid UI have a UIAspectRatioConstraint property – if not, I will switch it to so, but I still believe it may not fix my problem, as I have tried that before and it hasn’t worked

[diamondcheesefries]

Thanks! Took a bit of toying around but I switched both values