liveBook · Manning

ColumnSpan

As explained in .NET MAUI in Action

ColumnSpan is a .NET MAUI Grid property that specifies how many columns a child view spans.

ColumnSpan is a .NET MAUI Grid property that makes a child view occupy multiple adjacent columns. The view still starts in its assigned Grid.Column, while ColumnSpan specifies how many columns it covers. section 5.1.2

Use ColumnSpan when a view should extend across a designed grid area:

  • Assign the starting position with Grid.Column. section 5.1.2
  • Set ColumnSpan to the number of columns the view should occupy. section 5.1.2
  • Use RowSpan for the equivalent behavior across multiple vertical rows. section 5.1.2

Calculator display spanning four columns

A calculator Grid has four columns. Place its display in the first column and set Grid.ColumnSpan="4" so the display stretches across the complete top row: <Label Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="4" x:Name="LCD" />. section 5.1.2

How .NET MAUI in Action covers it

How deep it goes
Defines the starting column and span count, then briefly extends the same idea to RowSpan without covering layout internals.
Examples
Uses a calculator LCD spanning four columns and a profile layout whose sections span three columns or overlap two.
What it assumes
Assumes basic Grid positioning and column definitions while teaching the span-count decision through concrete layouts.
What you can do after
Apply it via XAML to make calculator displays and designed page sections extend across their intended Grid columns.
How it connects
Connects Grid.Column, Grid.Row, RowSpan, and XAML layout definitions.
Cover of .NET MAUI in Action
liveBookmanning.com
Read .NET MAUI in Action on liveBook Get the book at manning.com

Related concepts

This explainer was generated by Manning's knowledge graph from the text of .NET MAUI in Action. The section links point to the parts of the book it draws on.