#417 – Using Star Sizing to Distribute Space Evenly across Rows or Columns

You can use star sizing when setting the height of a row in a Grid or the width of a column.  After a Grid allocates space for rows and columns that are sized using absolute values or auto-sized to fit the row/column contents, it will distribute the remaining space in the Grid across rows and columns that use star sizing.

In the simplest case, if the height or width is specified as “*”, space is distributed evenly across all remaining rows/columns.

    <Grid ShowGridLines="True">
    	<Grid.RowDefinitions>
    		<RowDefinition Height="Auto"/>
    		<RowDefinition Height="*"/>
    		<RowDefinition Height="*"/>
    		<RowDefinition Height="*"/>
    	</Grid.RowDefinitions>

    	<Label Grid.Row="0" Content="Row 0 autosizes to this label" />
    	<Label Grid.Row="1" Content="1/3 of remaining space" />
    	<Label Grid.Row="2" Content="Another 1/3" />
    	<Label Grid.Row="3" Content="Final 1/3" />
	</Grid>



Star sizing is the default for a row’s height or a column’s width, if you do not explicitly set a height or width.

Advertisements