Source: Roblox Creator Hub · CC BY 4.0 · View source · Code samples: MIT Imported 2026-10-03. Formatting adapted for this site.
UIGridStyleLayout
Inherits from: UILayout → UIComponent → UIBase → Instance → Object
The base class for grid style UI layouts.
Inherits from: UILayout
Descendants: UIGridLayout, UIListLayout, UIPageLayout, UITableLayout
Memory category: Instances
Tags: NotCreatable, NotBrowsable
Properties
| Name | Type / Returns | Description |
|---|---|---|
| UIGridStyleLayout.AbsoluteContentSize | Vector2 | The absolute size of space being taken up by the grid layout. |
| UIGridStyleLayout.FillDirection | FillDirection | Determines the axis in which UI objects are laid out. |
| UIGridStyleLayout.HorizontalAlignment | HorizontalAlignment | Determines the horizontal alignment of UI elements within the parent element. |
| UIGridStyleLayout.SortOrder | SortOrder | Determines the order in which child UI objects are placed in a layout. |
| UIGridStyleLayout.VerticalAlignment | VerticalAlignment | Determines the vertical alignment of UI elements within the parent element. |
Inherited from Instance
| Name | Type / Returns | Description |
|---|---|---|
| Instance.Archivable | boolean | Determines if an Instance and its descendants can be cloned using Instance:Clone(), and can be saved/published. |
| Instance.archivable | boolean | |
| Instance.Capabilities | SecurityCapabilities | The set of capabilities allowed to be used for scripts inside this container. |
| Instance.IsInSandbox | boolean | Indicates whether the instance is inside a sandboxed container. |
| Instance.Name | string | A non-unique identifier of the Instance. |
| Instance.Parent | Instance | Determines the hierarchical parent of the Instance. |
| Instance.PredictionMode | PredictionMode | Reflects the client-side prediction mode applied to the instance under server-authoritative physics. |
| Instance.RobloxLocked | boolean | A deprecated property that used to protect CoreGui objects. |
| Instance.Sandboxed | boolean | When enabled, the instance can only access abilities in its Capabilities list. |
| Instance.UniqueId | UniqueId | A unique identifier for the instance. |
Inherited from Object
| Name | Type / Returns | Description |
|---|---|---|
| Object.ClassName | string | A read-only string representing the class this Object belongs to. |
| Object.className | string |
UIGridStyleLayout.AbsoluteContentSize
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.
| Field | Value |
|---|---|
| type | Vector2 |
| tags | ["ReadOnly","NotReplicated"] |
| security | {"read":"None","write":"None"} |
| thread safety | Unsafe |
| category | Data |
| serialization | {"can_load":false,"can_save":false} |
| capabilities | ["UI"] |
UIGridStyleLayout.FillDirection
The FillDirection property determines the axis in which UI elements are laid out. FillDirection.Horizontal arranges objects from left to right, while 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 SortOrder.LayoutOrder.
| Field | Value |
|---|---|
| type | FillDirection |
| security | {"read":"None","write":"None"} |
| thread safety | ReadSafe |
| category | Behavior |
| serialization | {"can_load":true,"can_save":true} |
| capabilities | ["UI"] |
UIGridStyleLayout.HorizontalAlignment
The HorizontalAlignment property determines the X axis alignment of the grid of UI elements, much like TextLabel.TextXAlignment does with TextLabel.Text.
| Field | Value |
|---|---|
| type | HorizontalAlignment |
| security | {"read":"None","write":"None"} |
| thread safety | ReadSafe |
| category | Alignment |
| serialization | {"can_load":true,"can_save":true} |
| capabilities | ["UI"] |
UIGridStyleLayout.SortOrder
The SortOrder property determines the order in which child UI objects are placed in a layout.
For 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 SortOrder.Name, an alphanumeric sort is used on the Instance.Name of the child UI objects.
| Field | Value |
|---|---|
| type | SortOrder |
| security | {"read":"None","write":"None"} |
| thread safety | ReadSafe |
| category | Behavior |
| serialization | {"can_load":true,"can_save":true} |
| capabilities | ["UI"] |
UIGridStyleLayout.VerticalAlignment
The VerticalAlignment property determines the Y axis alignment of the grid of UI elements, much like TextLabel.TextYAlignment does with TextLabel.Text.
| Field | Value |
|---|---|
| type | VerticalAlignment |
| security | {"read":"None","write":"None"} |
| thread safety | ReadSafe |
| category | Alignment |
| serialization | {"can_load":true,"can_save":true} |
| capabilities | ["UI"] |
Methods
| Name | Type / Returns | Description |
|---|---|---|
| UIGridStyleLayout:ApplyLayout | () | Force re-layout of sibling UI elements. |
| UIGridStyleLayout:SetCustomSortFunction | () | Sets the function used to determine the order of elements when SortOrder is set to Custom. |
Inherited from Instance
| Name | Type / Returns | Description |
|---|---|---|
| Instance:AddTag | () | Applies a tag to the instance. |
| Instance:children | Instances | Returns an array of the object's children. |
| Instance:ClearAllChildren | () | This method destroys all of an instance's children. |
| Instance:Clone | Instance | Create a copy of an instance and all its descendants, ignoring instances that are not Archivable. |
| Instance:clone | Instance | |
| Instance:Destroy | () | Sets the Instance.Parent property to nil, locks the Instance.Parent property, disconnects all connections, and calls Destroy() on all children. |
| Instance:destroy | () | |
| Instance:FindFirstAncestor | Instance? | Returns the first ancestor of the Instance whose Instance.Name is equal to the given name. |
| Instance:FindFirstAncestorOfClass | Instance? | Returns the first ancestor of the Instance whose Object.ClassName is equal to the given className. |
| Instance:FindFirstAncestorWhichIsA | Instance? | Returns the first ancestor of the Instance for whom Object:IsA() returns true for the given className. |
| Instance:FindFirstChild | Instance? | Returns the first child of the Instance found with the given name. |
| Instance:findFirstChild | Instance | |
| Instance:FindFirstChildOfClass | Instance? | Returns the first child of the Instance whose ClassName is equal to the given class name. |
| Instance:FindFirstChildWhichIsA | Instance? | Returns the first child of the Instance for whom Object:IsA() returns true for the given className. |
| Instance:FindFirstDescendant | Instance? | Returns the first descendant found with the given Instance.Name. |
| Instance:GetActor | Actor? | Returns the Actor associated with the Instance, if any. |
| Instance:GetAttribute | Variant | Returns the value which has been assigned to the given attribute name. |
| Instance:GetAttributeChangedSignal | RBXScriptSignal | Returns an event that fires when the given attribute changes. |
| Instance:GetAttributes | Dictionary | Returns a dictionary of the instance's attributes. |
| Instance:GetChildren | Instances | Returns an array containing all of the instance's children. |
| Instance:getChildren | Instances | |
| Instance:GetDebugId | string | Returns a coded string of the debug ID used internally by Roblox. |
| Instance:GetDescendants | Instances | Returns an array containing all of the descendants of the instance. |
| Instance:GetFullName | string | Returns a string describing the instance's ancestry. |
| Instance:GetStyled | Variant | Returns the styled or explicitly modified value of the specified property, or else the default property value if it hasn't been styled/modified. |
| Instance:GetStyledPropertyChangedSignal | RBXScriptSignal | Returns an event that fires when the given style property changes on the instance. |
| Instance:GetTags | Array | Gets an array of all tags applied to the instance. |
| Instance:HasTag | boolean | Check whether the instance has a given tag. |
| Instance:IsAncestorOf | boolean | Returns true if an Instance is an ancestor of the given descendant. |
| Instance:IsDescendantOf | boolean | Returns true if an Instance is a descendant of the given ancestor. |
| Instance:isDescendantOf | boolean | |
| Instance:IsPropertyModified | boolean | Returns true if the value stored in the specified property is not equal to the code-instantiated default. |
| Instance:QueryDescendants | Instances | Returns an array containing all descendants of the instance that match the selector string. |
| Instance:Remove | () | Sets the object's Parent to nil, and does the same for all its descendants. |
| Instance:remove | () | |
| Instance:RemoveTag | () | Removes a tag from the instance. |
| Instance:ResetPropertyToDefault | () | Resets a property to its default value. |
| Instance:SetAttribute | () | Sets the attribute with the given name to the given value. |
| Instance:WaitForChild | Instance | Returns the child of the Instance with the given name. If the child does not exist, it will yield the current thread until it does. |
Inherited from Object
| Name | Type / Returns | Description |
|---|---|---|
| Object:GetPropertyChangedSignal | RBXScriptSignal | Get an event that fires when a given property of the object changes. |
| Object:IsA | boolean | Returns true if an object's class matches or inherits from a given class. |
| Object:isA | boolean |
UIGridStyleLayout:ApplyLayout
Deprecated.
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
| Type | Description |
|---|---|
| () |
| Field | Value |
|---|---|
| tags | ["Deprecated"] |
| security | None |
| thread safety | Unsafe |
| capabilities | ["UI"] |
Code samples: View on Creator Hub (UI-Sort-Order).
UIGridStyleLayout:SetCustomSortFunction
Deprecated. This method is deprecated in favor of using other SortOrder means, such as by Name or LayoutOrder.
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
| Name | Type | Default | Description |
|---|---|---|---|
| function | Function | nil |
Returns
| Type | Description |
|---|---|
| () |
| Field | Value |
|---|---|
| tags | ["Deprecated"] |
| security | None |
| thread safety | Unsafe |
| capabilities | ["UI"] |
Events
Inherited from Instance
| Name | Type / Returns | Description |
|---|---|---|
| Instance.AncestryChanged | Fires when the Instance.Parent property of this object or one of its ancestors is changed. | |
| Instance.AttributeChanged | Fires whenever an attribute is changed on the Instance. | |
| Instance.ChildAdded | Fires after an object is parented to this Instance. | |
| Instance.childAdded | ||
| Instance.ChildRemoved | Fires after a child is removed from this Instance. | |
| Instance.DescendantAdded | Fires after a descendant is added to the Instance. | |
| Instance.DescendantRemoving | Fires immediately before a descendant of the Instance is removed. | |
| Instance.Destroying | Fires immediately before (or is deferred until after) the instance is destroyed via Instance:Destroy(). | |
| Instance.StyledPropertiesChanged | Fires whenever any style property is changed on the instance, including when a property is set to nil. |
Inherited from Object
| Name | Type / Returns | Description |
|---|---|---|
| Object.Changed | Fires immediately after a property of the object changes, with some limitations. |