A row definition tells a .NET MAUI Grid how to size one horizontal row. Each definition uses a Height value. Together, the definitions establish the vertical structure of the Grid before controls are placed into it. A Grid with five row definitions has rows numbered 0 through 4, with row 0 at the top. section 5.1.2
Define rows either as RowDefinition elements inside Grid.RowDefinitions or as a comma-separated RowDefinitions value on the Grid itself. Both forms produce the same layout; the inline form is the shorter choice for a straightforward Grid. section 5.1.2
Choose a Height value based on the layout behavior you need:
- Use * for a proportional share of the available Grid height. Multiple * rows divide that space equally. section 5.1.2
- Use a number before * for a weighted proportional share. A 4* row receives four times the height of a * row. section 5.1.3
- Use a numeric height when a row must remain a fixed size, such as 100 for consistently sized calculator-button rows. section 5.1.3
Give a calculator display more room
A calculator Grid can use one display row and four button rows. With RowDefinitions="4*,*,*,*,*", the display row gets four shares while each button row gets one. There are eight total shares, so the display uses half of the available height and the four button rows share the other half. This avoids giving every row the same height when the display needs more space. <Grid ColumnDefinitions="*,*,*,*" RowDefinitions="4*,*,*,*,*" RowSpacing="2" ColumnSpacing="2"> section 5.1.3
Star values are relative proportions, not fixed device-independent units. For example, 1*, 3*, 8* creates the same proportions as 4*, 12*, 32*. This makes proportional rows useful when available height changes, but the resulting controls can stretch differently on portrait phones and wide desktop windows. section 5.1.3
When consistent button dimensions matter more than filling all available space, combine a flexible row with fixed rows. A calculator can keep its screen row flexible while assigning 100-height rows to buttons; centering the Grid helps preserve the intended layout on a wide desktop window. section 5.1.3
Listing 5.10 Updated Grid with proportional screen and rows
<Grid ColumnDefinitions="*,*,*,*"
RowDefinitions="4*,*,*,*,*" #1
RowSpacing="2"
ColumnSpacing="2">
Inspect an inline Grid declaration where the first row is weighted at 4* and the remaining four rows use equal * sizing. section 5.1.3
