深入浅出WPF 第一部分(8)

5.4 UI布局(Layout)

5.4.1 布局元素

Grid(网格)， StackPanel(栈式面板)， Canvas(画布)， WrapPannel(自动折行面板)

5.4.2 Grid

1. 定义Grid的行与列

Grid类具有ColumnDefinitions和RowDefinitions两个属性，它们分别是ColumnDefinition和RowDefinition的集合，表示Grid定义了多少列，多少行。

比例值是在double类型后面加一个星号("*")。解析器会把所有比例值的数值加起来作为分母，把每个比例值的数值作为分子，再用这个分值乘以未被占用空间的像素数，得到的结果就是分配给这个比例值的最终像素数。

比例值最大的特点是当UI整体尺寸改变后，它会保持固有的比例。

行高和列宽的默认形式就是比例值，所以如果没有显式指定行高或列宽时，默认值就是1*，1*又可以简写为*。

如果你使用自动值(字符串“Auto”)为行高或列宽赋值，那么行高或列宽的实际值将由行列内控件的高度和宽度决定，通俗点讲就是控件会把行列“撑”到合适的高度和宽度。

    <Grid Margin="10">        <Grid.ColumnDefinitions>            <ColumnDefinition Width="Auto" MinWidth="120"/>            <ColumnDefinition Width="*" />            <ColumnDefinition Width="4" />            <ColumnDefinition Width="80" />         </Grid.ColumnDefinitions>        <Grid.RowDefinitions>            <RowDefinition Height="25px"/>             <RowDefinition Height="4"/>             <RowDefinition Height="*"/>            <RowDefinition Height="4"/>             <RowDefinition Height="25"/>         </Grid.RowDefinitions>        <TextBlock Text="请选择您的部门并留言: " Grid.Column="0" Grid.Row="0" VerticalAlignment="Center" />        <ComboBox Grid.Column="1" Grid.Row="0" Grid.ColumnSpan="4" />        <TextBox Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="5" />        <Button Content="提交" Width="80" Grid.Row="4" Grid.Column="1"  HorizontalAlignment="Right"/>        <Button Content="清除" Width="80" Grid.Row="4" Grid.Column="3" />    </Grid>