Windows 8布局控件教程

核心提示：</Grid>2. 相对尺寸控制，该方法使用"*"符号作为宽或高的值，Windows 8布局控件教程(2)，其含义是控件对象将占据布局控件中剩余所有有效空间，由于是由星型标志组成，例如下面的代码，第一行高度将根据控件的高度自动分配，所以也可以称为星型尺寸控制，该方法可以灵活控制表格的宽度

</Grid>

2. 相对尺寸控制，该方法使用"*"符号作为宽或高的值，其含义是控件对象将占据布局控件中剩余所有有效空间。由于是由星型标志组成，所以也可以称为星型尺寸控制。该方法可以灵活控制表格的宽度和高度，所以在布局设计中非常实用。

例如：定义一个第一行是第二行高度两倍的表格，其代码如下:

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

以上代码无论第一行控件占据空间多少，都永远是第二行的两倍高度。例如，如果Grid高度为600像素，那么第一行则被分配400px，第二行则是200px。

如果在以上表格中添加一个3*，其表格比率则为3:2:1， 则行高度将被分配为300px, 200px, 100px.

3. 自动尺寸控制, 设置宽度和高度为“Auto”,该方法将根据控件对象的高度和宽度自动调节分配表格高度和宽度，该控制方式经常与相对尺寸控制配合使用。例如下面的代码，第一行高度将根据控件的高度自动分配，而第二行高度则取剩余布局控件高度值。

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

实例代码:

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Button Content="普通按钮" HorizontalAlignment="Center" Margin="0" VerticalAlignment="Center" d:IsHidden="True"/>
<Button Content="普通按钮" Grid.Column="1" HorizontalAlignment="Center" Margin="0" VerticalAlignment="Center" d:IsHidden="True"/>
<Button Content="普通按钮" Grid.Column="2" HorizontalAlignment="Center" Margin="0" VerticalAlignment="Center" d:IsHidden="True"/>
<Button Content="普通按钮" Grid.Column="3" HorizontalAlignment="Center" Margin="0" VerticalAlignment="Center" d:IsHidden="True"/>
<HyperlinkButton Content="链接按钮" HorizontalAlignment="Left" Margin="0" Grid.Row="1" VerticalAlignment="Bottom" d:IsHidden="True"/>