公司网站维护与更新,全网业务自助商城,专业网站设计建设服务,外贸网站搭建难不难UniformGrid控件#xff08;均分布局#xff09;
UniformGrid和Grid有些相似#xff0c;只不过UniformGrid的每个单元格面积都是相等的#xff0c;不管是横向的单元格#xff0c;或是纵向的单元格#xff0c;它们会平分整个UniformGrid。
UniformGrid控件提供了3个属性…UniformGrid控件均分布局
UniformGrid和Grid有些相似只不过UniformGrid的每个单元格面积都是相等的不管是横向的单元格或是纵向的单元格它们会平分整个UniformGrid。
UniformGrid控件提供了3个属性分别是FirstColumn、Columns 、Rows 。FirstColumn表示第一行要空几个单元格后面两个属性分别用于设置行数和列数。
1. 默认情况
这是我们没有UniformGrid的属性的效果它会根据子元素的数量和UniformGrid自身的尺寸来决定行数和列数。 UniformGridButton Content1 Margin2/Button Content2 Margin2/Button Content3 Margin2/Button Content4 Margin2//UniformGrid2. 设置参数
设计当前UniformGrid为3行3列同时设置第一行第一个单元格保持空白。 UniformGrid FirstColumn1 Rows3 Columns3Button Content1 Margin2/Button Content2 Margin2/Button Content3 Margin2/Button Content4 Margin2//UniformGrid3. 总结
UniformGrid控件使用非常简单方便通常用于局部的布局。
StackPanel控件栈式布局
StackPanel用于水平或垂直堆叠子元素。也就是说StackPanel同样也有一个Children属性而Children集合中的元素呈现在界面上时只能是按水平或垂直方式布局。
public class StackPanel : Panel, IScrollInfo, IStackMeasure
{public static readonly DependencyProperty OrientationProperty;public StackPanel();public double HorizontalOffset { get; }public double ViewportHeight { get; }public double ViewportWidth { get; }public double ExtentHeight { get; }public double ExtentWidth { get; }public bool CanVerticallyScroll { get; set; }public bool CanHorizontallyScroll { get; set; }public Orientation Orientation { get; set; }public double VerticalOffset { get; }public ScrollViewer ScrollOwner { get; set; }protected internal override Orientation LogicalOrientation { get; }protected internal override bool HasLogicalOrientation { get; }public void LineDown();public void LineLeft();public void LineRight();public void LineUp();public Rect MakeVisible(Visual visual, Rect rectangle);public void MouseWheelDown();public void MouseWheelLeft();public void MouseWheelRight();public void MouseWheelUp();public void PageDown();public void PageLeft();public void PageRight();public void PageUp();public void SetHorizontalOffset(double offset);public void SetVerticalOffset(double offset);protected override Size ArrangeOverride(Size arrangeSize);protected override Size MeasureOverride(Size constraint);}StackPanel提供了一些属性和方法最常用的是Orientation枚举属性用于设置子控件在StackPanel内部的排列方式分别是水平排列Horizontal和垂直排列Vertical。默认值是垂直排列Vertical。
1. 垂直排列 StackPanel OrientationVerticalButton Content1 Margin20 /Button Content2 Margin20 /Button Content3 Margin20 /Button Content4 Margin20 //StackPanel注意 当StackPanel子元素处于垂直排列时此时子元素的宽度默认与StakcPanel的宽度保持一致但是子元素的高度是与其自身的高度自适应显示。
2. 水平排列 StackPanel OrientationHorizontalButton Content1 Margin20 /Button Content2 Margin20 /Button Content3 Margin20 /Button Content4 Margin20 //StackPanel注意 当StackPanel子元素处于水平排列时此时子元素的高度默认与StakcPanel的高度保持一致但是子元素的宽度是与其自身的宽度自适应显示。
3. StackPanel控件复杂使用
可以利用子控件的HorizontalAlignment属性或VerticalAlignment来设置子控件在StackPanel内部的显示位置比如在垂直排列布局模式下可以设置HorizontalAlignment属性值Left表示显示在左则Right显示在右则Center则居中显示Stretch表示拉伸填充显示。
需要注意的是由于WPF的控件布局都是采用自适应计算每个控件的位置所以在设置了HorizontalAlignment或VerticalAlignment后子控件的宽度和高度都会重新计算主要是根据自身内容的尺寸计算。
ScrollViewerStackPanel OrientationVerticalButton Content1 Margin20 HorizontalAlignmentLeft/Button Content2 Margin20 HorizontalAlignmentRight/Button Content3 Margin20 HorizontalAlignmentCenter/Button Content4 Margin20 HorizontalAlignmentStretch/Button Content5 Margin20 /Button Content6 Margin20 /Button Content7 Margin20 /Button Content8 Margin20 /Button Content9 Margin20 //StackPanel/ScrollViewer我们可以看到上图中前三行的按钮都是根据自身内容的宽高自适应绘制的。另外如果StackPanel内部的子控件太多则需要配合滚动条容器ScrollViewer控件。
