Reference API Roblox

Engine API

Website

Related

Reference API Roblox

UIFlexItem

Defines flex behavior for a GuiObject within a UIListLayout.

Member index 4

HistoryMember
726FlexMode: UIFlexMode
726GrowRatio: float
726ItemLineAlignment: ItemLineAlignment
726ShrinkRatio: float
inherited from Instance
726Archivable: bool
726Capabilities: SecurityCapabilities
726IsInSandbox: bool
726Name: string
726Parent: Instance
726PredictionMode: PredictionMode
726Sandboxed: bool
726UniqueId: UniqueId
576AddTag(tag: string): null
573ClearAllChildren(): null
462Clone(): Instance
573Destroy(): null
486FindFirstAncestor(name: string): Instance
486FindFirstAncestorOfClass(className: string): Instance
486FindFirstAncestorWhichIsA(className: string): Instance
486FindFirstChild(name: string, recursive: bool = false): Instance
486FindFirstChildOfClass(className: string): Instance
486FindFirstChildWhichIsA(className: string, recursive: bool = false): Instance
486FindFirstDescendant(name: string): Instance
563GetActor(): Actor
486GetAttribute(attribute: string): Variant
462GetAttributeChangedSignal(attribute: string): RBXScriptSignal
631GetAttributes(): Dictionary
648GetChildren(): Instances
462GetDebugId(scopeLength: int = 4): string
707GetDescendants(): Instances
486GetFullName(): string
706GetStyled(name: string, selector: string?): Variant
657GetStyledPropertyChangedSignal(property: string): RBXScriptSignal
576GetTags(): Array
576HasTag(tag: string): bool
486IsAncestorOf(descendant: Instance): bool
486IsDescendantOf(ancestor: Instance): bool
664IsPropertyModified(property: string): bool
698QueryDescendants(selector: string): Instances
573Remove(): null
576RemoveTag(tag: string): null
664ResetPropertyToDefault(property: string): null
573SetAttribute(attribute: string, value: Variant): null
462WaitForChild(childName: string, timeOut: double): Instance
726children(): Instances
726clone(): Instance
726destroy(): null
726findFirstChild(name: string, recursive: bool = false): Instance
726getChildren(): Instances
726isDescendantOf(ancestor: Instance): bool
726remove(): null
462AncestryChanged(child: Instance, parent: Instance)
462AttributeChanged(attribute: string)
462ChildAdded(child: Instance)
462ChildRemoved(child: Instance)
462DescendantAdded(descendant: Instance)
462DescendantRemoving(descendant: Instance)
500Destroying()
657StyledPropertiesChanged()
726childAdded(child: Instance)
inherited from Object
726ClassName: string
726className: string
647GetPropertyChangedSignal(property: string): RBXScriptSignal
647IsA(className: string): bool
726isA(className: string): bool
647Changed(property: string)

Description

The UIFlexItem object defines flex behavior for its parent GuiObject under the control of a UIListLayout. The defined flex behavior overrides that of the controlling UIListLayout, letting you configure flex behavior on a per‑object basis where necessary.

Example of UIFlexItem applied to a specific GuiObject under control of a UIListLayout. Example hierarchy of a UIFlexItem parented to a GuiObject under control of a UIListLayout.

History 13

Members 4

FlexMode

TypeDefault
UIFlexMode

UIFlexMode value which defines how the parent GuiObject grows or shrinks with available space in the flex layout container.

When the container's size is larger than the flex line's combined basis size, a value of UIFlexMode.Grow sets an effective 1:0 grow‑shrink ratio on the parent GuiObject. Objects set to UIFlexMode.Grow never shrink below their basis size, so overflow may occur if the container becomes smaller than the line's combined basis size.

Diagram showing two items in a line with FlexMode set to Grow.

When the container's size is smaller than the flex line's combined basis size and the controlling UIListLayout is not set to wrap (resulting in overflow), a value of UIFlexMode.Shrink sets an effective 0:1 grow‑shrink ratio on the parent GuiObject. Objects set to UIFlexMode.Shrink never grow above their basis size, so underflow may occur if the container becomes larger than the line's combined basis size.

Diagram showing two items in a line with FlexMode set to Shrink.

When the container's size is either larger or smaller than the flex line's combined basis size, a value of UIFlexMode.Fill sets an effective 1:1 grow‑shrink ratio on the parent GuiObject. This setting ensures the flex line always fills the container, even if the container size changes.

Diagram showing two items in a line with FlexMode set to Fill.

For fine-tuned layouts, a value of UIFlexMode.Custom enables the GrowRatio and ShrinkRatio properties, allowing for relative growth or shrinking of the object in a ratio compared to other flex objects also under control of a UIFlexItem.

History 2

GrowRatio

TypeDefault
float

If there is free space in the flex line, this property determines the amount the parent GuiObject grows relative to other flex items in the line. Applies only if FlexMode is set to UIFlexMode.Custom.

History 2

ItemLineAlignment

TypeDefault
ItemLineAlignment

Cross-axis alignment of the specific parent GuiObject within the flex line. See UIListLayout.ItemLineAlignment for details.

History 2

ShrinkRatio

TypeDefault
float

If there is overflow in the flex line, this property determines the amount the parent GuiObject shrinks relative to other flex items in the line. Applies only if FlexMode is set to UIFlexMode.Custom.

History 2

Settings