Pretty self explanatory title. I’m not very experienced in UI scaling but I’d love to know how that UI manages to scale evenly depending on the screen resolution!
I would say that UiAspectRatioConstraints sucks. Use scale. There are plugins that convert from Offset to Scale, or you can do it manually. Using Scale will work with Almost any screen size and device.
I then use a UISizeConstraint to set a min/max size of the frame in offset (I know the aspect ratio doesn’t 100% match up between my Min/Max values but it shouldn’t matter anyway). You can also uncap the max size for all screens by setting the values to inf, inf.
Finally I use a UIAspectRatioConstraint to ensure the frame keeps a constant aspect ratio, for this specific UI I have the DominantAxis as Height, but Width is also an option incase you do not like the results with Height.
The end result should be something similar to this:
You should do everything that @Tom_atoes said to do, but you can do that easier with this plugin, if that helps you at all AutoScale Lite - Roblox
you can convert the offset immediately to scale without having to calculate, and it will put an aspect ratio constraint with all the properties already done for you.
Some of my friends have just used a .1 or decimal into the positioning of the UI, sometimes it works and sometimes it doesn’t. Hopefully this can help.
Check for Camera.ViewportSize changing, and then update scaling inside code.
What they did was more than likely just scale it using aspect ratios. I’d only do the ViewportSize stuff if you tryna get square based objects in a GridLayout
The thing is though, aspect ratios still dont give me the desired effect
Viewports (although keep a very nice scaling UI) mess up the positioning and dont scale down enough (look at comparison)
I thought of maybe using UIScale and changing its value based on the resolution?? But I dont know how to properly run calculations for something like that
You can use both UIAspectRatioConstraint and UIScale. UIAspectRatioContraint is self-explanatory, but UIScale makes it so that every pixel gets scaled-down based on UIScale.Scale.
This would require some scripting. Checking the canvas size and dynamically change the UIScale based on one or both axis.
I’m pretty fine with scripting, but horrible at math. If someone here could explain me how would that work atleast in theory (more elaborated) I could see if it matched my goal.
It takes just a bit of testing to see the pattern you can use for the Scale property of the UIScale to make it fit. I find that dividing the ViewportSize.X by 886 works: