Contents

Column

A container directive that holds general markup content describing a column with a row in a grid-based layout.

Declaration

@Column(size: Int = 1, alignment: Alignment = leading) {
    ...
}

Parameters

  • size:

    The size of this column. (optional)

    Specify a value greater than 1 to make this column span multiple columns in the parent Row.

  • alignment:

    The alignment of this column’s content. (optional)

    leading

    Align to the leading edge.

    center

    Align to the center.

    trailing

    Align to the trailing edge.

Overview

Create a column inside a Row by nesting a @Column directive within the content for an @Row directive. Use size to span multiple columns and alignment to control content positioning.

@Row {
    @Column {
        Default (leading) alignment
    }

    @Column(alignment: center) {
        Centered content
    }

    @Column(size: 2, alignment: trailing) {
        Trailing alignment; twice as wide
    }
}