XAML、WPF 学习笔记-容器学习

容器学习：

　　所有的WPF布局容器都派生自System.Windows.Controls.Panel。Panel继承自FrameworkElement。 在Panel中有一个比较重要的属性是UIElementCollection 类型的Children属性,UIElementCollection是一个有序的集合。我们可以使用继承自Panel的类来重写MeasureOverride(),ArrangeOverride()实现自定义面板。

• StackPanel: 堆栈面板，水平或垂直放置元素。
• WrapPanel:可换行的行中放置元素，在水平方向上从左向右放置元素，换行后也是从左向右。在垂直方向上，从上到下放置元素，在切换列后也是从上到下。
• DockPanel: 根据容器的整个边界调整元素。
• Grid:在行列表格中排列元素。
• UniformGrid:强制所有单元格具有相同尺寸。
• Canvas:使用固定坐标绝对定位元素。
• ScrollViewer:通过添加滚动条可以使当前过长布局内的内容纵向或者横向滚动。再有限的区域内可以通过滚动呈现更多的内容。

　　Border不是布局面板，但是经常与布局类的面板一起配合使用，所以先介绍Border。Border的主要作用是给元素添加边框，这个元素可以理解为一个布局面板，一个控件等等。他包含设置边框的2个属性，BorderBrush用来设置颜色，BorderThickness用来设置宽度。CornerRadius设置圆角。而Padding和Margin一个设置边框和里面元素的间距，一个设置边框和其他临近元素的间距。而Background则是设置border所有内容的颜色。

 

　　1、Grid

　　　　它可以将窗口分割成更小区域，能够将元素分割到不可见的网格中。有点类似于HTML中table

　　　　分割窗体：将窗体分割成两行三列。  Grid.ColumnSpan 跨指定列、Grid.RowSpan 跨指定行

    <Grid ShowGridLines="True">
        <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>

　　　　　　<Grid Grid.Column="0" Background="Black" Grid.RowSpan="1" Grid.ColumnSpan="1">
　　　　　　　　<Label Content="Label 内容" />
　　　　　　</Grid>

　　　　</Grid>

　　2、StackPanel

　　　　将子元素排列成水平或垂直的一行，属于布局控件，通俗说叫栈式面板。可将包含的元素在水平或垂直方向排成一条线，当移除一个元素后，后面的元素会自动向前填充空缺。

　　　　改变 Orientation 的属性值进行切换 水平：Orientation.Horizontal 垂直 Orientation.Vertical

 

　　3、WrapPanel

　　　　WrapPanel面板可以一次排列一行或一列然后再换行继续排列，和StackPanel一样，可以通过设置Orientation属性来设置当前是以水平还是垂直来排列子元素。因为是根据窗体变化演示布局排列，这个只有XAML。

 

　　4、DockPanel

　　　　DockPanel面板与StackPanel面板类似，但是DockPanel可以通过设置Dock附加属性设置子元素停靠的边。Dock的值为Left、Right、Top、Bottom。通过设置子元素再DockPanel面板中的Dock属性。可以修改子元素再DockPanel面板内的位置。可以通过LastChildFill设置为true来告诉DockPanel面板使最后一个元素占满剩余控件。而设置的停靠顺序会影响布局结果。

 

　　5、UniformGrid

　　　　UniformGrid面板的特点是每个单元格始终保持一致的大小。通过设置行列数量来分割布局。元素通过放入的前后顺序被分配到不同的位置。这个再某些特定场景配合数据虚拟化和列表虚拟化使用的还是比较多的。

 　　

　　6、Canvas

　　　　Canvas是一个基于坐标的布局面板。他主要用于构建图形工具的绘图、Canvas知识再指定的位置放置子元素。并且子元素要提供精确的尺寸。再Canvas中需要设置Canvas.Left和Canvas.Top属性。用来设置相对于原点的left和top。
也可以使用Canvas.Right和Canvas.Bottom。但是Canvas.left和Right不能同时使用，Canvas.Top和Canvas.Bottom也不能同时使用。使用Panel.ZIndex来设置子元素的层级关系。

 

　　7、ScrollViewer

　　　　如果要再一个比较小的区域内显示特别多的内容，就需要使用ScrollViewer来进行横向或纵向滚动了，但是再实际使用过程中往往配合数据虚拟化和列表虚拟化来实现支持更多内容的滚动效果。不然如果内容一旦特别多，ScrollViewer下的内容又特别长，每次滚动都会触发布局的重新测量和排列。如果不使用虚拟化，会全部重新计算所有的布局元素，会特别卡，导致使用困难。