Layout

Layout

Containers that arrange children in a line and clip + scroll oversized content. All return UIComponent and accept a Style plus either varargs or a Consumer<ContainerScope> lambda.

Row

Horizontal linear layout. Sums child widths, takes the max child height. Style applies to the row itself (padding, background, border, etc.).

Row(UIComponent... children)
Row(Style style, UIComponent... children)
Row(Consumer<ContainerScope> content)
Row(Style style, Consumer<ContainerScope> content)

Row(
    Style.padding(8).backgroundColor(0xFF_22_22_22).build(),

    Button("Cancel"),
    Button("OK")
);

Row(scope -> {
    for (var tab : tabs) {
        scope.Button(tab.label, /* style */);
    }
});

Column

Vertical linear layout. Takes the max child width, sums child heights.

Column(UIComponent... children)
Column(Style style, UIComponent... children)
Column(Consumer<ContainerScope> content)
Column(Style style, Consumer<ContainerScope> content)

Column(
    Style.padding(16).backgroundColor(0xFF_1A_1A_1A).build(),

    Text("Settings", Style.fontSize(20).bold().build()),
    Text("Audio",    Style.fontSize(14).build()),
    SliderInt(volume, 0, 100)
);

VScroll

Vertical scrolling container around a single child. The child's height is unconstrained (it can exceed the container), and a scrollbar is drawn on the right edge. Wheel scroll, click + drag the bar, and arrow / Page / Home / End keys all work.

VScroll(UIComponent content)
VScroll(Style style, UIComponent content)

VScroll(
    Style.height(200).build(),
    Column(scope -> {
        for (int i = 0; i < 100; i++) {
            scope.Text("row " + i);
        }
    })
);

ContainerScope.VScroll(...) exists too — pass it a Consumer<ContainerScope> and it auto-wraps the content in a Column so children stack vertically.

HScroll

Horizontal scrolling container. Mirror of VScroll: child width is unconstrained, scrollbar is drawn at the bottom.

HScroll(UIComponent content)
HScroll(Style style, UIComponent content)

HScroll(
    Style.width(MATCH_PARENT).height(80).build(),
    Row(scope -> {
        for (var image : gallery) {
            scope.Image(image, Style.width(80).height(80).build());
        }
    })
);

Layout sentinels

Inside a row or column, children's Style.width / Style.height accept the size sentinels documented in Concepts:

• Size.WRAP_CONTENT — fit to intrinsic content size
• Size.MATCH_PARENT — fill remaining cross-axis space
• a positive integer — explicit pixel size

Styles.MATCH_PARENT and Styles.WRAP_CONTENT are the same constants under static-import-friendly names.

Margin and spacing

The library doesn't ship a dedicated Spacer component — use Style.margin(...) or an empty fixed-size element. Inter-child spacing inside a Row/Column is currently driven by each child's own margin.