WPF布局元素

• Grid

　　Grid会以网格的形式对内容元素进行布局，其特点如下：

1. 可以定义任意数量的行和列，非常灵活；
2. 行的高度和列的宽度可以使用绝对数值、相对比例或自动调整的方式进行精确设定，并可设置最大值和最小值；
3. 内部元素可以设置自己所在的行和列，还可以设置自己纵向跨几行、横向跨几列；
4. 可以设置Children元素的对齐方向。

　　Grid适用场合有：

1. UI布局的大框架设计；
2. 大量UI元素需要成行或者成列对齐的情况；
3. UI整体尺寸改变时，元素需要保持固有的高度和宽度比例；
4. UI后期可能有较大变更或扩展。

　　定义Grid

　　Grid有ColumnDefinitions和RowDefinitions两个属性，来定义列和行，代码如下： 

 <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
    </Grid>

 　　也可通过代码动态添加，代码如下： 

this.MyGrid.RowDefinitions.Add(new RowDefinition());
this.MyGrid.ColumnDefinitions.Add(new ColumnDefinition());

 Grid的行高列宽单位

　　计算机图形设计的标准单位是像素（Pixel），所以Grid的行高列宽的单位就是像素，除此之外还接受英寸（Inch）、厘米（Centimeter）和点（Point）作为单位。

　　UI只显示在计算机屏幕上，使用像素最为合适，如果程序涉及打印输出，则选择厘米、英制单位使用英寸比较合适。

Grid的行高列宽值

　　可以设置三类值：

1. 绝对值：double数值加上单位后缀（以像素为单位可以省略），一经设定后就不再改变。常用于控件的宽度和高度不再改变或用空行空列作为控件间隔；
2. 比例值：double数值后加上一个星号（*），当UI的整体尺寸改变后，控件会保持固有的比例。默认形式就是比例值，即没有显示设置行高列宽是默认是1*；
3. 自动值：字符串Auto，行高列宽由其内的控件决定，没有控件则为0。 

• StackPanel

 　　StackPanel可以把内部元素在纵向或横向上紧凑排列，形成栈式布局，通俗讲就是把内部元素像垒积木一样“摞起来”。当把前面的元素去掉后，后面的元素就会整体向前移动，补充原有元素的空间。

　　StackPanel使用的场合有：

1. 同类元素需要紧凑排列（如制作菜单或者列表）；
2. 移除其中的元素后能够自动补缺的布局或动画。

　　定义StackPanel

　　StackPanel用三个属性来控制内部元素的布局

属性标题	数据类型	可取值	描述
Orientation	Orientation枚举	Horizontal Vertical	决定内部元素是横向积累还是纵向积累
HorizontalAlignment	HorizontalAlignmen枚举	Left Center Right Stretch	决定内部元素水平方向上的对齐方式
VerticalAlignment	VerticalAlignment枚举	Top Center Botton Stretch	决定内部元素竖直方向上的对齐方式

　　定义代码如下：

    <StackPanel Orientation="Vertical" VerticalAlignment="Top">
        
    </StackPanel>

 

• Canves

 　　在Canves里布局与在Windows Form窗体上布局是一样的，只是在Windows Form开发时我们通过设置控件的Left和Top等属性来确定控件在窗体的位置，而在WPF中控件没有Left和Top的属性，当控件被放入Canves里时就被附加上类Canves.X和Canves.Y属性。

　　Canves适用场合有：

1. 一经设计基本上不会再有改动的小布局（如图标）；
2. 艺术性比较强的布局；
3. 需要大量使用横坐标进行绝对点定位的布局；
4. 依赖于横坐标的动画。

• DockPanel

 　　DockPanel内的元素会被附加上DockPanel.Dock这个属性，该属性为Dock枚举，可取Left、Top、Right、Bottom四个值。根据Dock属性值，DockPanel内的元素会向指定方向累积，切分DockPanel内部的剩余可用空间。

　　DockPanel还有一个重要的属性-bool类型的LastChildFill，默认值为True。当LastChildFill为True时，DockPanel内最后一个元素的Dock属性将被忽略，这个元素会把DockPanel内部所有剩余空间充满。

• WrapPanel

　　WrapPanel内部采用的是流式布局。WrapPanel使用Orientation属性来控制流延伸的方向，使用HorizonatalAlignment和VerticalAlignment两个属性控制内部控件的对齐。在流延伸的方向上，WrapPanel会排列尽可能多的控件，排不下的控件将会新起一行或一列继续排列。