Spacer & Expanded

Flexible widgets for distributing space in Row and Column layouts.

Spacer

Creates a flexible empty space that expands to fill available space.

Basic Usage

Spacer()

Options

Parameter	Type	Description	Example
`flex`	`float32`	Optional flex weight (default: 1)	`Spacer(2)`

Examples

// Push items to opposite ends
Column([]any{
    Text("Top"),
    Spacer(),
    Text("Bottom"),
})

// Push items to opposite ends in a row
Row([]any{
    Text("Left"),
    Spacer(),
    Text("Right"),
})

// Multiple spacers with different weights
Row([]any{
    Text("A"),
    Spacer(1),    // Takes 1 part of remaining space
    Text("B"),
    Spacer(2),    // Takes 2 parts of remaining space
    Text("C"),
})

// Center content with spacers
Column([]any{
    Spacer(),
    Text("Centered"),
    Spacer(),
})

Expanded

Wraps a widget to make it expand and fill available space.

Basic Usage

Expanded(child)

Options

Parameter	Type	Description	Example
`child`	`Widget`	The widget to expand	`Expanded(Text("Fills space"))`
`flex`	`float32`	Optional flex weight (default: 1)	`Expanded(child, 2)`

Examples

// Expand a widget to fill remaining space
Row([]any{
    Text("Label:"),
    Expanded(TextField(Hint("Enter text"))),
})

// Expand content area in a layout
Column([]any{
    Text("Header"),
    Expanded(ScrollView(content)),
    Text("Footer"),
})

// Multiple expanded widgets with different weights
Row([]any{
    Expanded(Container(Text("1/3"), Background(Red)), 1),
    Expanded(Container(Text("2/3"), Background(Blue)), 2),
})

// Expanded with equal weights
Row([]any{
    Expanded(Button("Option A")),
    Expanded(Button("Option B")),
    Expanded(Button("Option C")),
})

Spacer vs Expanded

Widget	Use Case
`Spacer()`	Empty flexible space
`Expanded(child)`	Make a widget fill available space

Both support flex weights for proportional sizing.