WPF(五):DockPanel布局和WrapePanel布局

一.DockPanel:停靠面板

  DockPanel定义一个区域,在此区域中,您可以使子元素通过描点的形式排列,这些对象位于 Children 属性中。停靠面板类似于WinForm中控件的Dock属性。DockPanel会对每个子元素进行排序,并将根据指定的边进行停靠,多个停靠在同侧的元素则按顺序排序。在DockPanel中,指定停靠边的控件,会根据定义的顺序占领边角,所有控件绝不会交叠。

 默认情况下,后添加的元素只能使用剩余空间,无论对DockPanel的最后一个子元素设置任何停靠值,该子元素都将始终填满剩余的空间。如果不希望最后一个元素填充剩余区域,可以将DockPanel属性LastChildFill设置为false,还必须为最后一个子元素显式指定停靠方向。

1、填充整个剩余空间

使用XAML代码实现:
WPF(五):DockPanel布局和WrapePanel布局_第1张图片


    
        
        
        
        
        
    

2、最后元素不填充剩余空间
WPF(五):DockPanel布局和WrapePanel布局_第2张图片
使用XAML代码实现:


    
        
        
        
        
        
    

二.WrapPanel:环绕面板

WrapPanel布局面板将各个控件从左至右按照行或列的顺序罗列,当长度或高度不够时就会自动调整进行换行,后续排序按照从上至下或从右至左的顺序进行。

 Orientation——根据内容自动换行。当Orientation属性的值设置为 Horizontal:元素是从左向右排列的,然后自上至下自动换行。当Orientation属性的值设置为Vertical:元素是从上向下排列的,然后从左至右自动换行。

ItemHeight——所有子元素都一致的高度。每个子元素填充高度的方式取决于它的VerticalAlignment属性、Height属性等。任何比ItemHeight高的元素都将被截断。

ItemWidth——所有子元素都一致的宽度。每个子元素填充高度的方式取决于它的VerticalAlignment属性、Width属性等。任何比ItemWidth高的元素都将被截断。

1、Orientation属性的值设置为 Horizontal

示例效果图如下2图所示,图1是窗体宽度较小时候的效果,图2是窗体宽度拉大以后的效果
WPF(五):DockPanel布局和WrapePanel布局_第3张图片
WPF(五):DockPanel布局和WrapePanel布局_第4张图片
使用XAML代码实现:


    
        
        
        
        
        
        
        

2、Orientation属性的值设置为Vertical

示例效果图如下2图所示,图1是窗体高度较大时候的效果,图2是窗体高度较小时的效果
WPF(五):DockPanel布局和WrapePanel布局_第5张图片

WPF(五):DockPanel布局和WrapePanel布局_第6张图片
使用XAML代码实现:


    
        
        
        
        
        
        
        

你可能感兴趣的:(WPF(五):DockPanel布局和WrapePanel布局)