~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
开发工具与关键技术：Visual Studio 2015
作者：朱海恩
撰写时间： 2019.05.18
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
XAML五个布局元素：
一、Grid:网格。可以自定义行和列并通过行列的数量、行高列宽来调整控件的布局。
特点：
可以定义任意数量的行和列，非常灵活行的高度和列的宽度可以使用绝对值、相对比例或自动调整的方式进行精确设定，并可以设置最大和最小值内部元素可以设置自己所在的行和列，还可以设置自己纵向跨几行，横向跨几列可以设置Children元素的对齐方向Grid的适用场合有：
UI布局的大框架设计大量UI元素需要成行或者成列对齐的情况UI尺寸改变的时候，元素需要保留固有的宽度和高度比例Row和Column分别是行和列，可以通过网格来把窗口分为几行几列，可以直接设置行Row的高和列Column的宽，也可以通过比例来设置。如果想在第一行第二列添加内容，可以通过Grid的属性（Grid.Row="0"和Grid.Column="1"）来获取，还有跨行和跨列的话，同样通过Grid的属性（Grid.RowSpan="2"和Grid.ColumnSpan="1"）来获取。
<Grid>
<!--三列-->
<Grid.ColumnDefinitions>
<ColumnDefinition Width="79*"/>
<ColumnDefinition Width="101*"/>
<ColumnDefinition Width="114*"/>
</Grid.ColumnDefinitions>
<!--四行-->
<Grid.RowDefinitions>
<RowDefinition Height="43*"/>
<RowDefinition Height="57*"/>
<RowDefinition Height="59*"/>
<RowDefinition Height="111*"/>
</Grid.RowDefinitions>
<!--第一行、第三列-->
<TextBlock Grid.Row="0" Grid.Column="2"></TextBlock>
<!--第一行、行跨三列-->
<TextBlock Grid.Row="0" Grid.ColumnSpan="3"></TextBlock>
</Grid>
DockPanel：泊靠式面板
使用场合：DockPanel停靠容器，专门负责自适应窗口的布局。
<DockPanel>
<Button DockPanel.Dock="Left" Content="Left"></Button>
<Button DockPanel.Dock="Top" Content="Top"></Button>
<Button DockPanel.Dock="Right" Content="Right"></Button>
<Button DockPanel.Dock="Bottom" Content="Bottom"></Button>
<Button Content="ContentLeft"></Button>
</DockPanel>
三、StackPanel：栈式面板
特点：每个元素各占一行或者一列。
使用场合：
同类元素需要紧凑排列（如制作菜单和列表）。
移除其中的元素后能够自动补缺的布局或者动画。
StackPanel适合水平或者垂直方向的布局，固定的区域不适合使用Grid来进行布局，可以使用StackPanel来布局。
<StackPanel Orientation="Vertical">
<Button Content="Left"></Button>
<Button Content="Top"></Button>
<Button Content="Right"></Button>
<Button Content="Bottom"></Button>
</StackPanel>
四、WrapPanel：自动折行面板（环绕面板）
WrapPanel布局面板将各个控件从左至右按照行或列的顺序排列，当长度或高度不够时就会自动调整进行换行，后续排序按照从上至下或从右至左的顺序进行。
Orientation——根据内容自动换行； ItemHeight——所有子元素都一致的高度； ItemWidth——所有子元素都一致的宽度。
<WrapPanel Orientation="Vertical">
<Button Content="Left"></Button>
<Button Content="Top"></Button>
<Button Content="Right"></Button>
<Button Content="Bottom"></Button>
</WrapPanel>
五、Canvas：画布面板
画布，用于完全控制每个元素的精确位置。他是布局控件中最为简单的一种，直接将元素放到指定位置，主要来布置图面。
在XAML设计界面，超出的部分不会进行裁剪，
<Canvas>
<Button Height="200" Canvas.Right="10" Canvas.Bottom="-100" Content="按钮"></Button>
</Canvas>
如图所示：
如果将ClipToBounds属性设为true，在设计界面将会对子元素的超出部分进行裁剪。
注意：要说明一点Canvas内的子控件不能使用两个以上的Canvas附加属性，如果同时设置Canvas.Left和Canvas.Right属性，那么后者将会被忽略。
