What is difference between " * " and "Auto" in Silverlight Grid Layout Definitions

Question

trying to understand the following:

<Grid Name="Root">
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>
</Grid>

Can anyone help me in explaining the difference between * and Auto in the above snippet?

thanks

Answer 1

Auto means give this column/row the size of the contained items.

* means share the rest of the available space with other columns/rows that also specify *.

In fact * is equivalent to 1*. It is possible to specify 2*, 3* ... N* for a width or height. The algorithm Silverlight uses is to total all values of N for all the rows using * then give each row its appropriate share of the available space. For example:-

<Grid.RowDefinitions>
    <RowDefinition Height="*" />
    <RowDefinition Height="2*" />
    <RowDefinition Height="3*" />
    <RowDefinition Height="Auto" />
</Grid.Definitions>

This would first determine how high the forth row needs to be from its content and substract that from the full availabe height. The remainder of height will be divided amoungst the * rows. The first getting 1/6, the second getting a 1/3 and the third getting 1/2 of the available height.

Answer 2

Auto will make the each column size so it can fit whatever is contained in it.

* will use up the maximum amount of available space. It is best to use when you have a "left over" column that you want to just resize to whatever is left over.

Example Grid of width undefined.

Scenario 1:

Column 1  | Column 2  | Column 3
----------------------------------
100 Width | Auto      | 200 Width

On this case column 2 could be anything between 1 and whatever the content that is put in it requires and the max space available for the grid's width. If column 2 was changed to * and a width defined on the grid as a whole it would to fill in the left over space to achieve the grid's width. If you had two columns set as *, and a grid width defined, then they would compete for the left over space and split it.

Usually I use * for only one column maximum (although this is not a rule) if I have a control that is set to a dynamic size so that the column will fill in whatever space is left over by the other columns. It's great if you want specific sized columns for a dynamically sized control and want certain columns to stay fixed and define one column to expand to fill in the rest of the control. Auto would not do this with empty or low content columns that would not actually fill the left over space.

Scenario 2 (col 3 contains content that is 100 width and grid has a total width of 800):

Column 1  | Column 2  | Column 3  | Column 4
--------------------------------------------
100 Width | 200 Width | Auto      | *

Column 3 would then only size to 100 width. Column 4 would size to 400 width to fill in the left over space.