How can I make GUI adjust its position to the size of the screen on their device

I have made a UI however it needs to work on different screen sizes.

I want it to adjust its position to the middle of the screen that its on.
How can I do this?


For example, for it to go to the middle of the screen

1 Like

Refer to this thread, should help you.

4 Likes

I’ve tried this and used the plugin linked but I still get wierd stuff like this?

You are using the plugin incorrectly; could you send a picture of the position & size properties?

image
Explorer window and properties shown here.

Your position values are still in offset.

Also, a word of advice, group your UI into a 1,0,1,0 container frame.

1 Like

image
I tried this and it still does not work, and putting the UI into a frame (position, 1,0,1,0) i think that’s what you meant makes it just go off screen
image

image

1 Like

If it doesn’t work you’re doing it wrong, it’s as simple as that. Make sure that every UI object that you have is positioned and sized in scale.

Go through this tutorial to learn about positioning screen GUIs. Getting Started (roblox.com)

For your specific question, on your root GUI, set the AnchorPoint to { 0.5, 0, 0.5, 0 } and set the Position to {0.5, 0, 0.5, 0}. This puts the anchor of your GUI in its center and positions the GUI in the screen’s center. To maintain a consistent aspect ratio add a child UIAspectRatioConstraint and set the proportion how you like (something like 1.7 is usually nice). See UIAspectRatioConstraint | Roblox Creator Documentation

I’ve done this and it still does not scale or position properly.


image
image

Your warning frame is scaled, however the children of it are not.

I’ve done this now however this breaks it further.

My suggestion is to revert back to offset and then slowly convert each element of the GUI to Scale from child to parent. Just like everyone said, use Scale to achieve this and make sure you use the proper anchor point. I HIGHLY suggest you experiment around and try to learn how it works.

2 Likes

Your honestly making it harder than it seems, Every new GUI and I mean EVERY new one has to have its offset at 0 for X and y, You only scaled the frame which just makes it look broken even more.

1 Like

Hi,

Just been playing around a bit with a fresh GUI (I kind of remade it) and got it to scale correctly.
Not too sure what I did but I did restart and used scale and anchor points.

Thanks for your support!

Here’s the final

Download Autoscale. On each frame of UI (individual) parts of UI click and press scale on both position and size, you must click each UI individually, or it won’t work at all

1 Like