UI Container
Flexbox-style responsive layout container with horizontal/vertical flow, padding, and alignment.
Type: UIContainerNode · Category: UI & Interface · Also found as: uicontainer, uipanel, uipanelnode
Properties
Section titled “Properties”| Property | Type | Default | Description |
|---|---|---|---|
size |
vec2 | (320, 240) |
Width and height (px). Range 4 to 1280. |
title |
string | "Panel" |
Header text. |
direction |
enum: Vertical, Horizontal, Grid |
Vertical |
Children are laid out in a column, a row or a grid. |
alignment |
enum: Start, Center, End, Stretch |
Stretch |
Where children sit across the layout direction. |
spacing |
number | 8 |
Gap between items (px). Range 0 to 64. |
paddingTop |
number | 14 |
Space above the children (px). Range 0 to 100. |
paddingBottom |
number | 14 |
Space below the children (px). Range 0 to 100. |
paddingLeft |
number | 14 |
Space left of the children (px). Range 0 to 100. |
paddingRight |
number | 14 |
Space right of the children (px). Range 0 to 100. |
columns |
integer | 0 |
Grid layout: columns per row. Range 1 to 12. |
autoSizeHeight |
boolean | false |
Grow to fit the children. |
drawBackground |
boolean | true |
Fill the background. |
drawBorder |
boolean | true |
Draw a border. |
showHeader |
boolean | true |
Draw a header with the title. |
headerHeight |
number | 36 |
Height of the header (px). Range 20 to 64. |
backgroundColor |
color | #16181ef0 |
Fill colour of the background. |
headerColor |
color | #1c202aff |
Header fill colour. |
borderColor |
color | #373e4eff |
Colour of the border. |
titleColor |
color | #eef0f6ff |
Title text colour. |
Plus the common properties every node has.
Lua methods
Section titled “Lua methods”Call them on the node (self.node in its script, or self.node:get_node("path")). Every node also has the Node methods.
UIContainerNode:get_property(path)
Section titled “UIContainerNode:get_property(path)”Reads an Inspector property by its path (vectors and colours as tables); “script.
local value = self.node:get_property("size")pathUIContainerNodeProperty|string
Returns any
UIContainerNode:set_property(path, value, y)
Section titled “UIContainerNode:set_property(path, value, y)”Sets an Inspector property by its path: vectors as {x, y} or x, y; colours as {r, g, b[, a]} 0..1 or “#rrggbb[aa]”; enums by name; “script.
self.node:set_property("size", 100, 50)pathUIContainerNodeProperty|stringvalueanyy?number
In a scene file
Section titled “In a scene file”{ "type": "UIContainerNode", "name": "UIContainer", "position": [ 0, 0 ], "properties": { "size": [ 320, 240 ], "title": "Panel", "direction": "Vertical" }}