Layout Types

This page covers the layout-facing types that matter most in day-to-day Ansiq work. For the implementation path, read:

• Partial relayout and damage model
• Layout and rendering

Direction

Direction::Column
Direction::Row

This controls which axis a container uses when stacking children.

• Column: vertical stacking, common with Box::column()
• Row: horizontal arrangement for toolbars, status strips, and split panes

Length

Ansiq does not size widgets in pixels. Layout uses terminal-cell sizing policies:

Layout {
    width: Length::Fill,
    height: Length::Auto,
}

The common values are:

• Length::Auto: measure natural content size
• Length::Fill: consume remaining parent space
• Length::Fixed(n): reserve exactly n terminal cells

This is what lets Paragraph, List, and Input compose naturally inside the same container.

Constraint

Constraint matters most for Table and other multi-column widgets:

[
    Constraint::Length(12),
    Constraint::Min(24),
    Constraint::Fill(1),
]

Common meanings:

• Length(n): fixed column width
• Percentage(n): fraction of the parent width
• Fill(weight): weighted share of remaining width
• Min(n) / Max(n): lower and upper bounds

If you are building a table or inspector layout, start with Constraint instead of manually counting characters.

Flex

Once column widths are solved, Flex decides how the whole group sits in any leftover space:

Flex::Start
Flex::Center
Flex::End
Flex::SpaceBetween
Flex::SpaceAround
Flex::SpaceEvenly

The most common choices are:

• Start: columns stay left-aligned
• Center: center the whole group
• SpaceBetween: push the extra width into gaps between columns

Padding and block inset

Container widgets such as Block, Pane, and Shell do not hand their full outer rect to children. They first compute an inner rect:

Padding::all(1)
Padding::symmetric(2, 1)

Think of it as:

outer rect -> border/title/padding -> inner rect -> children

When content does not appear to reach the edge, the cause is usually inset math, not a broken layout.

Shell slot layout

Shell is not just another column. It is a fixed three-slot layout:

• header
• body
• footer

The body consumes the remaining space while header and footer stay visible. This makes it a good fit for:

• activity monitors
• explorers
• session shells

Use Box::column() for normal stacking. Use Shell when you need “top fixed, bottom fixed, middle flexible”.

When these types matter most

• building a custom widget or composition
• understanding why a region fills the remaining space
• debugging table column behavior
• understanding partial relayout and damage tracking