Layout: The visual arrangement of widgets in a user interface
margin is outside space away from other elements, not part of rendered element
width and height define the size of the rendered element in simplekit
If width is less than 2 * padding, contentBox.width will be negative, which:
Might cause drawing bugs (clipping, text not visible)
Might render as 0 in some toolkits, or collapse entirely
Layout might still proceed, but visually it could break alignment or look wrong
Widget sizes
Content Size is the size of what’s “inside” the widget
doesn’t include padding or margin
doesn’t consider a user-specified width or height
Intrinsic Size is the ”normal” widget size
includes padding and margin
uses content size or user-specified width or height
Layout Size is how much space the widget occupies in the layout
includes padding and margin
can be intrinsic size, but some layout methods shrink or expand the widget
In layouts like FillRow or StackCol, the parent can override this
Two Pass Layout
Measure
Calculate intrinsic sizes of children
Calculate intrinsic size of children in layout
Update parent intrinsic size
Layout
Assign children position and size in layout
May override child position
May override child intrinsic size
fixed
Layout allows elements to set their x, y, width, height
warn if element is outside bounds
returns Size of bounds used
Each child has an explicit position (x, y) and explicit size. The layout manager doesn’t reposition or resize them. So to determine how much space is needed to fit them all, it looks at the entire bounding box they occupy
For others like below 2, layouts ignore child .x / .y, measure each child’s intrinsic size (via .measure()), and decide how to stack/align/space them. So the container’s size is based on how it arranges its children
centre
sets new x and y position for each element
supports fillWidth and fillHeight
x and y positions are ignored
wrap
Places elements in rows, wrapping to next row as needed
condition to wrap to next line
tallest element determines row height
warns if vertical overflow
x and y positions are ignored
In SimpleKit, a widget’s width is either explicitly set or determined by the layout using fillWidth; unlike CSS, it does not support min/max ranges, but the result is still deterministic based on layout rules.
fill
element fillWidth to find proportion to fill
fillHeight option
measure calculation uses intrinsic width of all elements + gaps
If fillWidth = true, the child gets stretched to fit that space
ignore x and y too
measure the whole row
SimpleKit uses a layoutRequested flag to defer layout until the next frame, ensuring layout only runs when explicitly triggered by invalidateLayout().
