Grid

Grid divides its inner bounds into rows and columns. With no declarations it behaves as one star-sized row and column.

Use StackPanel when there is only one stacking axis and no shared column alignment.

new Grid
{
    Padding = 16,
    ColumnSpacing = 12,
    RowSpacing = 8,
    Columns =
    {
        GridLength.Auto,
        GridLength.Star,
        44
    },
    Rows =
    {
        GridLength.Auto,
        GridLength.Star
    },
    Children =
    {
        new Image
        {
            Source = ImageSource.Symbol("person.crop.circle"),
            Width = 36,
            Height = 36
        },
        new Label
        {
            VerticalAlignment = VerticalAlignment.Center,
            Text = "Account"
        }.Column(1),
        new Button
        {
            Icon = ImageSource.Symbol("chevron.right")
        }.Column(2),
        new Divider().Row(1).ColumnSpan(3)
    }
};

Track sizing

• GridLength.Auto fits the largest single-track child.
• A number or GridLength.Pixels(value) creates a fixed point size.
• GridLength.Star receives the remaining finite space.
• GridLength.Stars(weight) divides that remainder proportionally.

Inside an unconstrained axis, such as a vertical grid inside a vertical ScrollView, star tracks size to their content because there is no finite remainder to distribute.

Placement

Children begin at row and column zero. The fluent placement methods return the same view, so they can follow an initializer:

new Label { Text = "Details" }
    .Row(1)
    .Column(1)
    .ColumnSpan(2);

Indices outside the declared tracks are clamped. Spans are at least one and stop at the final available track.

Changing tracks and placement

Adding or replacing a value in Rows or Columns invalidates the grid automatically. The fluent placement values are attached layout metadata; call grid.InvalidateMeasure() after changing them on an existing child.

Use RowSpacing and ColumnSpacing for gaps between tracks and Padding for the outer inset. A spanning child includes the spacing between the tracks it covers.

For layouts that overlap rather than divide space, use Overlay.