Incular logoIncular
API ReferenceLayout Widgets

Flex

Direction-configurable flex container generalizing Row and Column.

Flex is Row + Column with an explicit direction: Axis (default Horizontal). Same defaults for everything else: Start / Max / Center / None→Ltr / Down / 0.0.

Props

Prop

Type

Construction

A direction-switching Flex application — copy, paste, and run:

use incular::prelude::*;

fn main() -> Result<(), Box<dyn std::error::Error>> {
    let app = Application::new(|_cx| {
        Container::builder()
            .padding(EdgeInsets::all(24.0))
            .alignment(Alignment::CENTER)
            .child(
                Column::builder()
                    .main_axis_size(MainAxisSize::Min)
                    .spacing(12.0)
                    .children(Vec::<Widget>::from([
                        Flex::horizontal(Vec::<Widget>::from([
                                Text::new("A").into(),
                                Text::new("B").into(),
                            ]))
                            .spacing(8.0).into(),
                        Flex::builder()
                                .direction(Axis::Vertical)
                                .children(Vec::<Widget>::from([
                                    Text::new("One").into(),
                                    Text::new("Two").into(),
                                ]))
                                .main_axis_alignment(MainAxisAlignment::Center)
                                .cross_axis_alignment(CrossAxisAlignment::Stretch)
                                .spacing(4.0)
                                .build().into(),
                    ]))
                    .build(),
            )
            .build()
            .into()
    })?;
    incular::run(app)?;
    Ok(())
}

Methods

All Row/Column setters exist here too (direction first): direction, main_axis_alignment, main_axis_size, cross_axis_alignment, text_direction, vertical_direction, spacing — see the runnable program above for every call in context.

Use Flex when the axis itself is dynamic (e.g. driven by orientation or a Signal); otherwise prefer the clearer Row / Column.

Related: Expanded, Axis.

On this page