HStack
HStack is the convenience version of Row.
It gives you a shorter surface for the common case where you simply want children laid out left to right with optional spacing. It is useful when the defaults of Row already match your needs and extra alignment or semantics configuration would only add noise.
Use HStack for simple local composition. Do not use it when you need the fuller Row configuration surface, such as custom cross-axis alignment, wrapping, or semantics.
Example
use fission::prelude::*;
let widget: Widget = HStack {
spacing: Some(8.0),
children: vec![
Text::new("Name").into(),
Text::new("Required").into(),
],
}
.into();
Field table
| | | |
|---|
| | Child widgets laid out horizontally. | Defaults to an empty list. |
| | | Defaults to None. Maps to Row.gap. |
Behavior and advice
HStack simply builds a Row with the provided children and spacing. That means it inherits Row defaults, including centered cross-axis alignment and no wrapping.
The convenience is helpful when that is exactly what you want. If you catch yourself wishing you could tweak align_items, justify_content, wrap, or semantics, switch to Row rather than trying to bend HStack beyond its purpose.
Production checklist
For HStack, review the fields that change behavior before treating the widget as finished: children, spacing. The goal is to make the product rule visible in state and actions, not hidden inside ad-hoc construction code.
If this widget appears inside an interactive flow, keep the surrounding action binding in the parent component and test that the flow still has one clear reducer path.
When child widgets are generated from data, give reordered or filtered rows an explicit WidgetId so retained local state and scroll behavior do not drift between items.
Check the semantics tree for the user-facing label or role that makes this widget understandable without relying only on pixels.
Add at least one component or harness test that confirms the visible text, semantic role, action dispatch, and layout constraint that matter for this widget in context.
If a screen starts repeating the same HStack setup, extract a named component around this widget. That keeps the reference API small while making product code easier to read and safer for generated code to copy.
Row, VStack, and Spacer.