UIGridLayout and UIAspectRatio providing unwanted results

Help and Feedback Art Design Support
1

  1. What do you want to achieve?
    I’m currently working on a selection GUI and want to use a grid within a scrolling frame.

  2. What is the issue?
    There are massive gaps between the top of the scroll frame and between rows (which I think are caused from the UIAspectRatioConstraint):
    E1
    For the sake of convenience, I will save some words and provide a repro:
    repro.rbxl (24.5 KB)

Solutions I have tried so far:

  • Deleting the UIAspectRatio; which I absolutely need for the cells to be square, therefore a bad solution
  • Scaling the scroll frame relative to one axis; not ideal because I want it to scale both ways for different screen sizes

I’m not too experienced with UI design, so if there’s an obvious mistake (or more), please lemme know!

3 Likes
2

I don’t really want to download the file, but I’m assuming that you put the Aspect Ratio Constraint in each individual frame, put it in the Grid Layout instead.

13 Likes
3

Thanks bro! But there’s still a decent gap vertically between the rows despite my cell paddings being even?
E3

E4
E4363×527 50.7 KB

4

Use offset padding, scale uses the relative absolute canvas size.

What You can do is make the cell size this:

0.333, -5, 0,333, -5

and the cell padding this:

0, 5, 0, 5
3 Likes