UIGridStyleLayout

The AbsoluteContentSize property of a UIGridStyleLayout reveals how much space the elements of the grid are taking up, including any padding created by the grid. This property is particularly useful to size containers of grids such as Frames to make sure they aren't any larger than the grid itself.

This property updates as soon as it's read. It will not fire a Object.Changed event immediately after the UI has changed, but if the value is read, it will become current and a Object.Changed event will fire on the next render step.

The FillDirection property determines the axis in which UI elements are laid out. Enum.FillDirection.Horizontal arranges objects from left to right, while Enum.FillDirection.Vertical arranges objects from top to bottom. To reverse elements, such as to arrange right to left, you'll need to reverse the sorting; for example by negating the child UI objects' GuiObject.LayoutOrder values when UIGridStyleLayout.SortOrder is set to Enum.SortOrder.LayoutOrder.

The HorizontalAlignment property determines the X axis alignment of the grid of UI elements, much like TextLabel.TextXAlignment does with TextLabel.Text.

The SortOrder property determines the order in which child UI objects are placed in a layout.

For Enum.SortOrder.LayoutOrder, an ascending sort is used on the LayoutOrder property of child UI objects. If two children share the same LayoutOrder, whichever was added sooner to the parent object takes precedence.

For Enum.SortOrder.Name, an alphanumeric sort is used on the Instance.Name of the child UI objects.

The VerticalAlignment property determines the Y axis alignment of the grid of UI elements, much like TextLabel.TextYAlignment does with TextLabel.Text.

The ApplyLayout method forces sibling UI elements to be re-laid out in case the sorting criteria may have changed (such as when UIGridStyleLayout.SortOrder is set to Custom, and the UIGridStyleLayout:SetCustomSortFunction() behavior changed). Re-layouts automatically happen when UI elements are added/removed, or their Instance.Name or GuiObject.LayoutOrder change.

The manner in which sibling UI elements are laid out is dependent on the implementation of this abstract class. In other words, a concrete class like UIListLayout or UIGridLayout is responsible for the actual element positioning.

Returns

-- Place in a script in a UIListLayout
local uiGridLayout = script.Parent

-- Some data to work with
local scores = {
	["Player1"] = 2048,
	["Ozzypig"] = 1337,
	["Shedletsky"] = 1250,
	["Cozecant"] = 96,
}

-- Build a scoreboard
for name, score in pairs(scores) do
	local textLabel = Instance.new("TextLabel")
	textLabel.Text = name .. ": " .. score
	textLabel.Parent = script.Parent
	textLabel.LayoutOrder = -score -- We want higher scores first, so negate for descending order
	textLabel.Name = name
	textLabel.Size = UDim2.new(0, 200, 0, 50)
	textLabel.Parent = uiGridLayout.Parent
end

while true do
	-- The name is the player's name
	uiGridLayout.SortOrder = Enum.SortOrder.Name
	uiGridLayout:ApplyLayout()
	task.wait(2)
	-- Since we set the LayoutOrder to the score, this will sort by descending score!
	uiGridLayout.SortOrder = Enum.SortOrder.LayoutOrder
	uiGridLayout:ApplyLayout()
	task.wait(2)
end

This method is deprecated. Use UIGridStyleLayout.SortOrder instead.

The function should take two arguments (each will be an Instance child to compare), and return true if a comes before b, otherwise return false. In other words, use this function the same way you would use a ' function. The sorting should be deterministic, otherwise sort will fail and fall back to name order.

Parameters

Returns