> 文章列表 > WPF的布局常用的

WPF的布局常用的

WPF的布局常用的

Canvas

WPF 中的 Canvas 是一个面板控件,它提供了一种绘制图形、布局控件的方式。Canvas 是一个绝对定位的控件,可以在其中以任意位置、大小和形状摆放子控件,子控件的位置可以通过 Canvas.Left 和 Canvas.Top 等属性来指定。

以下是一个简单的示例,展示了如何使用 Canvas 在 WPF 中绘制图形

<Window x:Class="CanvasExample.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"Title="Canvas Example" Height="350" Width="525"><Canvas><Rectangle Canvas.Left="10" Canvas.Top="10" Width="100" Height="50" Fill="Blue" /><Ellipse Canvas.Left="50" Canvas.Top="80" Width="100" Height="50" Fill="Green" /><Line Canvas.Left="10" Canvas.Top="150" X1="0" Y1="0" X2="100" Y2="50" Stroke="Red" StrokeThickness="2" /></Canvas>
</Window>

在上面的示例中,我们创建了一个 Canvas,然后在其中添加了三个图形:一个矩形、一个椭圆和一条直线。通过设置 Canvas.Left 和 Canvas.Top 属性,我们可以指定每个图形在 Canvas 中的位置。这些图形可以使用 Width 和 Height 属性来指定宽度和高度,使用 Fill 属性来填充颜色或渐变,使用 Stroke 和 StrokeThickness 属性来设置边框颜色和边框宽度。在 Canvas 中添加子控件的顺序决定了它们在 Z 轴方向上的位置。

除了绘制图形,Canvas 还可以用于布局其他控件。通过设置子控件的 Canvas.Left 和 Canvas.Top 属性,我们可以将它们摆放在 Canvas 中的任意位置。这种绝对定位的方式可以使得控件的布局非常灵活,但同时也需要我们自己手动调整控件的位置和大小。


在这里插入图片描述

RowDefinition

RowDefinition 用于定义 Grid 中的每一行的高度(或百分比)。Grid.RowDefinitions 属性是一个集合,其中每个元素表示一行的定义。

RowDefinition 元素有两个重要的属性:

  1. Height :
    Height 属性用于设置行的高度,可以使用具体值(如 “50”),百分比(如 “30*”),自动大小(“Auto”)或自适应大小(“*”)。
  2. MinHeight :
    属性用于设置行的最小高度。
<Grid><Grid.RowDefinitions><RowDefinition Height="50"/><RowDefinition Height="Auto"/></Grid.RowDefinitions><!-- 内容 -->
</Grid>

在这个例子中,第一行的高度为 “50”,即具体值,表示这一行的高度为 50 个逻辑单位(通常是像素)。第二行的高度为自适应大小(“Auto”),这意味着该行的高度将根据其内容自动调整大小。

使用百分比(如 “30*”)可以让行的高度自适应大小,并且按照指定的比例分配可用的空间。


总之,RowDefinition 和 Grid.RowDefinitions 提供了一种方便的方式来定义网格中每一行的大小和行为。