认识WPF六大基础布局控件

(1)WPF六大常用布局元素：
1、Grid：网格。可以自定义行和列并通过行列的数量、行高列宽来调整控件的布局，近似HTML代码中的table。
2、DockPanel：泊靠式面板。内部元素可以选择泊靠的方向（上下左右），类似于Winform中设置控件的Dock属性。
3、StackPanel：栈式面板。可将包含的元素在水平或垂直方向排成一条线，当移除一个元素后，后面的元素会自动向前填充空缺(菜单栏经常用到此布局)。
4、WrapPanel：自动折行面板。内部元素在排满一行后能够自动折行，类似于Html中的流式布局。
5、Canvas：画布。内部元素可以使用以像素为单位的绝对坐标进行定位，类似于Windows Form 的布局方式。
6、注意，以上只是XAML常用的五大布局元素，并不是只有五种布局。

(2)Grid网格布局：
1、它的子控件被放在一个个实现并定义好的小格子里整齐配列。
2、功能最多且最为复杂。
3、要使用Grid，首先要向RowDefinitions和ColumnDefinitions属性中添加一定数量的RowDefinitions【行】和 ColumnDefinitions元素【列】，从而定义行数和列数。
4、如果没有设置任何行或列，Grid将会默认地将控件添加在第0行第0列，从0开始。
5、适用场合：①UI布局的大框架设计。②大量UI元素需要成行或者成列对齐的情况。③UI尺寸改变的时候，元素需要保留固有的宽度和高度比列。
6、特点：①可以定义任意数量的行和列，灵活性高。②行的高度和列的宽度可以使用绝对值、相对比例或自动调整的方式进行精确设定，并可以设置最大和最小值。③内部元素可以设置自己所在的行和列，还可以设置自己纵向跨几行，横向跨几列。④可以设置Children元素的对齐方向。
7、Grid的常用附加属性，如下图：

8、Grid中的行高与列宽，①比例值:【double数值加单位后缀(1cm)】、②绝对值:【double数值后加星号(“*”)】、③自动值【字符串Auto】。
9、将内容结合Grid的附加属性使用，可以确定内容的位置，并准确的对内容进行排版。
10、Grid.ColumnSpan：设置元素占表格两列位置。Grid.RowSpan：设置元素占表格两行位置。这两种附加属性均为跨行占位效果，不写这两种附加属性的话，默认是只占表格中的一格位置。
11、如果对元素设置了固定的宽高，那么，该元素的占位就会依据设定好的宽高来进行占位，跨行跨列附加属性对它无效。
12、垂直【HorizontalAlignment】与水平【VerticalAlignment】这两种属性可指定元素的对齐方式，默认的属性值为Stretch(不变)。

(3)DockPanel泊靠式面板：
1、定义出一个区域，在该区域中，可以使子元素通过描点的形式进行排列，此类对象位于Children属性当中，Children属性可以省略。
2、DockPanel会对每个子元素进行排序，并将根据指定的边进行停靠，多个停靠在同侧的元素则按顺序排序。
3、指定停靠在边上的控件，会根据定义的顺序占领边角，所有控件绝不会交叠。
4、默认情况下，后添加的元素只能使用剩余空间，无论对DockPanel的最后一个子元素设置任何停靠值，该子元素都将始终填满剩余的空间。若不希望最后一个元素填充剩余区域，可将DockPanel的属性LastChildFill设置为false后，再为其指定停靠方向。
5、常用于自适应窗口布局，泊靠的方向即上、下、左、右。
6、元素默认占整个表格的高度，宽度则由内容来决定，为指定泊靠的方向时，元素默认从左侧开始排列，后添加进来的元素将会占领页面剩余的所有空间。
7、通过DockPanel.Dock附加属性来指定元素泊靠的方向。
8、当元素被指定了上、下作为泊靠的方向，元素的内容则决定了元素的高度，宽度则默认占页面的一整行。
9、最后一个添加的元素占据的位置最小，因为先添加的元素权限比它大，因此，宽度无法占满一整行。
10、如何让最后一个添加进去的元素不占据剩余空间：通过LastChildFill附加属性，将其设置成false，最后一个添加进去的元素将不再占据剩余空间。
11、与网格Grid布局的相同点：都是通过附加属性来对元素进行排版。不同点：网格Grid是行列排版，DockPanel则是通过元素泊靠的方向来排版。

(4)StackPanel栈式面板：
1、将控件按照行或列的顺序进行排列，但不会换行。
2、通过Orientation属性，设置了两种排列方式：横排(Horizontal【默认】)和竖排(Vertical)。
3、默认情况下为垂直排序，水平排列时，每个元素都与面板一样高。垂直排列时，每个元素都与面板一样宽。
4、注意：若包含的元素超出了面板的空间，它会截断多出的内容【不会换行】。
5、特点：每个元素各占一行或一列。
6、适用场合：①同类元素需要紧凑排列时(如：制作菜单与列表)。②移除其中的元素后，能自动补缺的布局或动画。
7、栈式面板通过三个属性值来控制内部元素的布局，如下图：

7、设置了垂直排布后，面板内的元素将无法设置宽度。水平排布，则无法设置高度。

(5)WrapPanel自动折行面板(环绕面板):
1、面板会将各个控件从左至右按照行或列的顺序排列，当长度或高度不够时会自动调整换行，后续排序则按照从上至下或从右至左的顺序进行排序。
2、三种附加属性：①Orientation：根据内容自动换行。Orientation的属性值为 Horizontal时，元素是从左向右排列的，然后自上至下自动换行。当Orientation的属性值为Vertical，元素是从上向下排列的，然后从左至右自动换行。 ②ItemHeight：所有子元素高度都一致。每个子元素填充高度的方式取决于VerticalAlignment属性与Height属性，任何比ItemHeight高的元素都将被截断。③ItemWidth：所有子元素都宽度都一致。每个子元素填充宽度的方式取决于VerticalAlignment属性与Width属性，任何比ItemWidth宽的元素都将被截断。
3、排序的方向可以通过附加属性去控制，设置HorizontalAlignment属性可以改变元素的排列方向，默认从左侧开始排列。
4、只要窗口的宽度足够，面板内的元素就会一直排下去，直至排满后自动换行。

(6)Canvas画布面板：
1、属于布局控件中最为简单的一种，可以完全控制每个元素的精确位置，它能直接将元素放到指定的位置。
2、主要用来布置图面。
3、使用画布面板前，必须要先指定一个子元素的位置，否则所有元素都会出现在画布的左上角。
4、用Left、Right、Top和Bottom四个附加属性调整元素的位置。
5、窗口大小发生改变时，Canvas面板也会随之变化，子元素的位置也会随之移动，以此来保证相对于Canvas的位置属性不变。
6、画布面板允许子元素的部分或全部超出窗口边界，默认不会裁剪子元素。
7、Canvas面板并不简单，因为要去计算每个元素放置的位置。