We use cookies on this site to enhance your user experience

UITableLayout

UITableLayout

A UITableLayout lays out sibling UI elements as rows in a table. Child UI elements (the table cells) of these rows are then arranged in columns (within rows). Each cell within a row has the same height, and each cell within a column has the same width. The hierarchy in the explorer should look like this (Frames are yellow rows, TextLabels are cells)

Hierarchy of UI elements used with a UITableLayoutUITableLayout result

By changing the UITableLayout/FillDirection, sibling UI elements can act as columns instead.

When applied, a UITableLayout will take control of sibling and cell elements’ GuiObject/Size and GuiObject/Position. Changing these in the Properties window is still possible will not produce any effect.

Dimensions of the cells in the resulting table are controlled by the parent UI element’s dimensions. Unless UITableLayout/FillEmptySpaceColumns or UITableLayout/FillEmptySpaceRows is enabled, the cell dimensions will be that of the parent UI element (and thus tables with more than one cell extend outside of their parent).

Cells will continue to respect UISizeConstraint objects within them. In other words, setting UISizeConstraint/MinSize on UISizeConstraints within the header cells can determine the size of the rest of the cells. If UISizeConstraint/MaxSize restricts a cell’s size from filling the allotted space (i.e. another row/column is wider than it), it will align to the top-left.

Properties

Name Type Description
bool

Determines whether cells are sized such that they occupy the horizontal space of the parent UI element.

bool

Determines whether cells are sized such that they occupy the vertical space of the parent UI element.

TableMajorAxis

Determines whether sibling UI elements are treated as rows or columns.

UDim2

Determines the empty space between cells.

Inherited from Instance , UIBase , UIComponent , UILayout , UIGridStyleLayout

Archivable ClassName DataCost Name Parent RobloxLocked AbsoluteContentSize FillDirection HorizontalAlignment SortOrder VerticalAlignment