How would I make ui with UiAspectRatioConstraint stay in the same place?

You can write your topic however you want, but you need to answer these questions:

  1. What do you want to achieve? Keep it simple and clear!
    I want to know how to make ui with UiAspectRatioConstraint stay together.

  2. What is the issue? Include screenshots / videos if possible!
    The issue is that I wanted my ui to scale as a square so I used UiAspectRatioConstraint, but now when they get smaller they get further apart.
    Normal:


    UiAspectRatioConstraint when I change the size of the studio window:

    Scale instead of offset when I change the size of the studio window:
    Screen Shot 2021-07-23 at 11.39.52 AM

  3. What solutions have you tried so far? Did you look for solutions on the Developer Hub?
    I’ve tried to look on the devforum but I couldn’t find anything, however if I did miss something please tell me.
    After that, you should include more details if you have any. Try to make your topic as descriptive as possible, so that it’s easier for people to help you!

1 Like

I don’t deal too much with regards to UI but just wanted to propose this. Have you tried putting those 4 text labels into 1 Transparent frame and applying the UiAspectRatioConstrait to the frame instead of the 4 Labels individually? I would only assume logically that if you size the frame into a square and applying the UiAspectRatioConstraint that it should remain a square whatever screen dimensions it may be (You can scale this by Scale or Offset value (can be up to you). As for the labels in the frame, you can scale them however you want but you can play around with each of the labels anchor and position values so that each label is kinda focused on its own corner

Example:
Top Left: AnchorPoint (0,0) Position (0,0,0,0)
Top Right: AnchorPoint (1,0) Position (1,0,0,0)
Bottom Left: AnchorPoint (0,1) Position (0,0,1,0)
BottomRight AnchorPoint (1,1) Position (1,0,1,0)

From me testing this it seems like this may be what you are looking for. If ever you want me to clarify something in my answer let me know! :slight_smile:

1 Like

RobloxScreenShot20210724_075706467

From Testing with the display size of an Ipad and a Computer Screen, I assume this is what you’re hoping to achieve and such. Just wanted to send pictures to further help explain my post above

Thank you very much, but I wanted the textlabels to be in separate screenguis, if I can’t find another solution I’ll try to use your idea! :smile:

1 Like