Row

Row is the main horizontal layout primitive in Fission.

It lays children out left to right, with control over gap, wrapping, flex behavior, distribution, and optional semantics. Toolbars, inline forms, status bars, action rows, and card footers are all natural Row use cases.

Use Row when sibling order flows horizontally. Do not use it for vertical sections or large list virtualization. Those cases belong to Column and LazyColumn.

Example

use fission::core::ui::{Row, Text};
use fission_ir::op::AlignItems;

let node = Row {
    gap: Some(10.0),
    align_items: AlignItems::Center,
    children: vec![
        Text::new("Status").into_node(),
        Text::new("Connected").into_node(),
    ],
    ..Default::default()
}
.into_node();

Field table

Field	Type	Meaning	Notes / default behavior
id	Option<NodeId>	Stable node identity.	Defaults to None.
children	Vec<Node>	Child nodes laid out from left to right.	Defaults to an empty list.
semantics	Option<Semantics>	Optional accessibility semantics wrapper.	When present, the lowered row is wrapped in a semantics node.
flex_grow	f32	How much extra space the row absorbs from its parent.	Defaults to 0.0.
flex_shrink	f32	How much the row may shrink when space is tight.	Defaults to 1.0.
gap	Option<f32>	Horizontal spacing between children.	Defaults to None.
wrap	FlexWrap	Whether children wrap onto another line.	Defaults to FlexWrap::NoWrap.
align_items	AlignItems	Cross-axis alignment, which is vertical in a row.	Defaults to AlignItems::Center.
justify_content	JustifyContent	Main-axis distribution, which is horizontal in a row.	Defaults to JustifyContent::Start.

Layout behavior

Row lowers to a horizontal flex layout. That means justify_content controls horizontal distribution and align_items controls vertical placement of each child.

When content should wrap onto more than one line, Row can do that by setting wrap, but once the layout starts to behave like a responsive flow of many items, Wrap or SimpleGrid may read more clearly.

Specific advice

Use gap for ordinary spacing and Spacer when one child should push the next child away by absorbing remaining space. That distinction makes rows easier to read.

If you only need a shorter helper surface for a simple horizontal group, use HStack.

Related

Column, HStack, Wrap, and Spacer.