XAML布局元素

本文介绍了XAML中的六种布局元素:Grid、DockPanel、StackPanel、WrapPanel、UniformGrid和Canvas,详细阐述了每种布局的特点及适用场景,帮助开发者更好地理解和应用XAML布局。
摘要由CSDN通过智能技术生成

XAML布局元素(常用重点) :
Grid:网格。可以自定义行和列并通过行列的数量、行高列宽来调整控件的布局。近似Html中的table。
DockPanel:泊靠式面板。内部元素可以选择泊靠的方向(上下左右),类似于Winform中设置控件的Dock属性。
StackPanel:栈式面板。可将包含的元素在水平或垂直方向排成一条线,当移除一个元素后,后面的元素会自动向前填充空缺。(菜单 栏)
WrapPanel:自动折行面板(环绕面板)。内部元素在排满一行后能够自动折行,类似于Html中的流式布局。
UniformGrid:均分布局(横向的网格分割、纵向的网格分割分别是均等的分割的布局类型,各个单元格的大小完全相同,宽与高分别 相同)
Canvas:画布。内部元素可以使用以像素为单位的绝对坐标进行定位,类似于Windows Form 的布局方式。
一:Grid网格
定义:它的子控件被放在一个一个实现定义好的小格子里面,整齐配列。Grid和其他各个Panel比较起来,功能最多 也最为复杂。
要使用Grid,首先要向RowDefinitions和ColumnDefinitions属性中添加一定数量的RowDefinitions和 ColumnDefinitions元素,从而定义行数 和列数。
而放置在Grid面板中的控件元素都必须显示采用附加属性语法定义其 放置所在的行和列,它们都是以0为基准的整型值,如果没有显式设置 任何行或列,Grid将会隐式地将控件加入在第0行第0列。
特点: 可以定义任意数量的行和列,非常灵活。 行的高度和列的宽度可以使用绝对值、相对比例或自动调整的方式进行精确设定,并可以设置最大和最小值。 内部元素可以设置自己所在的行和列Grid.Row和Grid.Column,还可以设置自己纵向跨几行Grid.RowSpan,横向跨几列 Grid.ColumnSpan。 可以设置Children元素的对齐方向:水平HorizontalAlignment,垂直VerticalAlignment。
在这里插入图片描述

二、DockPanel:泊靠式面板
定义:DockPanel定义一个区域,在此区域中,您可以使子元素通过描点的形式排列,这些对象位于 Children 属性中。
DockPanel会对每个子元素进行排序,并将根据指定的边进行停靠,多个停靠在同侧的元素则按顺序排序。
在DockPanel中,指定停靠边的控件,会根据定义的顺序占领边角,所有控件绝不会交叠。
使用场合:DockPanel停靠容器,专门负责自适应窗口的布局。
三、StackPanel:栈式面板
定义:StackPanel就是将控件按照行或列来顺序排列,但不会换行。
通过设置面板的Orientation属性设置了两种排列方式:横排(Horizontal)和竖排(Vertical默认的)。
水平排列时,每个元素都与面板一样高;垂直排列时,每个元素都与面板一样宽。如果包含的元素超过了面板空间,它只会截断多出的内容。
特点:每个元素各占一行或者一列。
使用场合:同类元素需要紧凑排列(如制作菜单和列表)。 移除其中的元素后能够自动补缺的布局或者动画。 在这里插入图片描述

四、WrapPanel:自动折行面板(环绕面板)
定义:WrapPanel布局面板将各个控件从左至右按照行或列的顺序罗列,当长度或高度不够时就会自动调整进行换行,后续排序按照从上至下或 从右至左的顺序进行。
所用属性:Orientation——根据内容自动换行。当Orientation属性的值设置为 Horizontal:元素是从左向右排列的,然后自上至下自动换行。‘’当 Orientation属性的值设置为Vertical:元素是从上向下排列的,然后从左至右自动换行。
ItemHeight——所有子元素都一致的高度。每个子元素填充高度的方式取决于它的VerticalAlignment属性、Height属性等。任何比 ItemHeight高的元素都将被截断。
ItemWidth——所有子元素都一致的宽度。每个子元素填充高度的方式取决于它的VerticalAlignment属性、Width属性等。任何比 ItemWidth高的元素都将被截断。
五、UniformGrid:均分布局
定义:UniformGrid 就是Grid的简化版,每个单元格的大小相同,不需要定义行列集合。每个单元格始终具有 相同的大小,每个单元格只能容纳一个控件,将自动按照定义在其内部的元素个数,自动创建行列,并通常保持相同的行列数。 UniformGrid 中没有Row 和Column 附加属性,也没有空白单元格。
在这里插入图片描述

六:Canvas:画布面板
定义:画布,用于完全控制每个元素的精确位置。他是布局控件中最为简单的一种,直接将元素放到指定位置,主要来布置图面。调整位置用Left、Right、Top 和Bottom四个附加属性。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值