Skip to main content
GridRow(children: Component[]): Component;
GridRow(props: { alignment?: VerticalAlignment }, children: Component[]): Component;
​
children
Component[]
required
An array of components, one per column cell. Each child aligns with the corresponding column in the parent Grid.
​
props
object
Configuration options for the row.

​
Support

​
Usage

​
Basic row

Grid([
    GridRow([Text("Cell 1"), Text("Cell 2")]),
    GridRow([Text("Cell 3"), Text("Cell 4")])
])

​
With row alignment

Grid({ horizontalSpacing: 12 }, [
    GridRow({ alignment: "top" }, [
        Text("Short"),
        Text("This cell has\nmuch more\ncontent")
    ]),
    GridRow({ alignment: "bottom" }, [
        Text("Also short"),
        Text("Another\ntall cell")
    ])
])

​
Spanning columns

Use .gridCellColumns() on a child to span multiple columns: 
Grid([
    GridRow([Text("A"), Text("B"), Text("C")]),
    GridRow([
        Text("Spans two columns")
            .gridCellColumns(2),
        Text("C")
    ])
])

​
Notes

  • GridRow must be a direct child of Grid. Using GridRow outside a Grid has no effect.
  • The number of children in the widest GridRow determines the column count for the entire grid.
  • Apply .gridCellColumns(), .gridCellAnchor(), or .gridCellUnsizedAxes() to individual children to control cell layout.

​
See Also

  • Grid — parent grid container