WPF学习（三）布局面板

最新推荐文章于 2025-03-20 22:39:53 发布

养鼠的猫

最新推荐文章于 2025-03-20 22:39:53 发布

阅读量1.6k

点赞数

分类专栏： WPF 文章标签：布局 WPF StackPanel 布局面板

本文链接：https://blog.csdn.net/Alina_catty/article/details/93491554

版权

本文深入探讨WPF布局，包括StackPanel的简单布局、Border控件的使用、WrapPanel和DockPanel的复杂布局行为，以及Grid面板的灵活性，如调整行和列、共享尺寸组和UniformGrid。此外，还介绍了Canvas的基于坐标布局以及InkCanvas的手写输入支持。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

WrapPanel和DockPanel面板

布局

布局容器

所有布局容器都是派生自System.Windows.Control.Panel抽象类的面板。Panel类添加了少量成员，包括三个共有属性。

Panel类的共有属性
名称	摘要
Blackground	该属性用于面板背景着色的画刷。若想接收鼠标事件，就必须设置该属性为非空值
Children	该属性是在面板中存储的条目集合。这是第一级条目——这些条目自身也可以包含更多的条目
IsItemsHost	该属性是一个布尔值，如果面板用于显示与ItemsControl控件关联的项，该属性值为true

核心布局面板

核心布局面板
名称	说明
StackPanel	在水平或垂直的堆栈中放置元素。这个布局容器通常用于更大、更复杂窗口中的一些小区域
WrapPanel	在一系列可换行的行中放置元素。在水平方向上，WrapPanel面板从左向右放置条目，然后在随后的行中放置元素。在垂直方向上，WrapPanel面板在自上而下的列中放置元素，并使用附加的列放置剩余的条目
DockPanel	根据容器的整个边界调整元素
Grid	根据不可见的表格在行和列中排列元素，这是最灵活、最常用的容器之一
UniformGrid	在不可见但是强制所有单元格具有相同尺寸的表中放置元素，这个布局容器不常用
Canvas	使用固定坐标绝对定位元素。这个布局容器与传统Windows窗体应用程序最相似，但没有提供锚定或停靠功能。因此，对于尺寸可变的窗口，该布局容器不是合适的选择。如果选择的话，需要另外做一些工作。

使用StackPanel面板进行简单布局

在Grid里面放入一个StackPanel

<Grid>
    <StackPanel>
        <Label>A Button Stack</Label>
        <Button>Button 1</Button>
        <Button>Button 2</Button>
        <Button>Button 3</Button>
        <Button>Button 4</Button>
    </StackPanel>
</Grid>

默认情况下是垂直分布的布局（Vertical）

当然可以修改为水平分布的，补充属性

<StackPanel Orientation="Horizontal">

然后就会变成（很丑的样子）

布局属性

布局属性
名称	说明
HorizontalAlignment	当水平方向上有额外的空间时，该属性决定了子元素在布局容器中如何定位。可选用Center、Left、Right或Stretch等属性值
VerticalAlignment	当垂直方向上有额外的空间时，该属性决定了子元素在布局容器中如何定位。可选用Center、Left、Right或Stretch等属性值
Margin	该属性用于在元素的周围添加一定的空间。Margin属性是System.Windows.Thickness结构的一个实例，该结构具有分别用于顶部、底部、左边和右边添加空间的独立组件
MinWidth 和 MinHeight	这两个属性用于设置元素的最小尺寸。如果一个元素对于其他布局容器来说太大，该元素将被裁剪以适合容器
MaxWidth 和 MaxHeight	这两个属性用于设置元素的最大尺寸。
Width 和 Height	这两个属性用于显式地设置元素尺寸。这一设置会重写为HorizontalAlignment和VerticalAlignment属性设置的Stretch值，但不能超过MinWidth 和 MinHeight、MaxWidth 和 MaxHeight属性设置范围。

对齐方式

        <StackPanel Orientation="Vertical">
            <Label HorizontalAlignment="Center">A Button Stack</Label>
            <Button HorizontalAlignment="Left">Button 1</Button>
            <Button HorizontalAlignment="Right">Button 2</Button>
            <Button HorizontalAlignment="Stretch">Button 3</Button>
            <Button>Button 4</Button>
        </StackPanel>

效果

Stretch就是默认状态

边距

Margin在上一篇文章写了，就不再写了，放链接

WPF学习（二）ListView

最小尺寸、最大尺寸以及显式地设置尺寸

        <StackPanel Orientation="Vertical">
            <Label HorizontalAlignment="Center" Margin="3">A Button Stack</Label>
            <Button Margin="3" MaxWidth="200" MinWidth="100">Button 1</Button>
            <Button Margin="3" MaxWidth="200" MinWidth="100">Button 2</Button>
            <Button Margin="3" MaxWidth="200" MinWidth="100">Button 3</Button>
            <Button Margin="3" MaxWidth="200" MinWidth="100">Button 4</Button>
        </StackPanel>

最低0.47元/天解锁文章