Help with UI List Layout

Ok, what I’m trying to achieve is simple. I need to make a frame that it’s children go in a list like manor.

What I want:

What happens:

Any idea on how to achieve this?

The UI List Layout, has many properties that will help you to do it.
As you can center the elements, decide Fill Direction, etc.
You need to use Scalar Sizes on the Buttons you are placing too. A scale value of 1 on X, Will cause the button will fill the whole Frame that is containing it. 0.5 is the half.

I just mention it, cause I see theres a little button, Idk if thats the idea or you are using normal fixed size.

What I do, is storing those finished buttons, in a folder, then populate the UI list by script, using scalar sizes, and defining properties for all elements, the frames, the buttons, the UI list. And if your list will become greater, then using a ScrollingFrame.

EDIT. Im very bad explaining btw xD

1 Like

Yeah, I’m confused, can you simplify?

First, what elements are u using.
The ScreenGUI, a Normal Frame, the UI list layout, and Buttons.
What type of size they are? Offset or Scale?
You set the UI list, FillDirection property to Vertical or Horizontal?

1 Like

Screen shot 3
The parent of the TestLabel is the screengui btw also I’m using offset

What about, put those buttons into a holder, the size you want, the number of buttons you want per row?

What will this list contain? Players? Items? Having a clear idea, what is this for could lead you to a better approach

The list will contain text labels forming a larger string. The text will vary in color. That’s why I need to have the list like that. But I don’t know how to create this.

Edit: Also, if you dont have time to help me that’s fine

Thats not enough info for me I guess…
Let me give you a quick example on how to do that quick

A Scrolling frame that holds the UI list. Then another frame with scale size of 1 on X, inside the ScrollingFrame, that frame Holds a UI grid, with all the buttons, layers etc, you need PER row.

Everytime a player joins a new team with someone, I add another Frame by cloning it. Its predesigned, I just change the text on those items, and place that frame, The UIlist will place them vertically, preserving the layout of the cloned frame

EDIT
The Frame called TealItem is the Holder of the labels and buttons, if I add a new TealItem it will get ordered

1 Like

Ok, I will try this when I get back

1 Like

Ok, tried it and it works, thanks :))

1 Like