container: 容器
🔥 理想的 WPF 窗口需要遵循以下几条重要原则
❌ 以硬编码方式设定尺寸和位置是极其不当的处理方式,因为这会限制本地化界面的能力,并且会使界面更难处理动态内容。
- 不应显式设定元素(如控件)的尺寸。 例如,当添加更多的文本时按钮应当能够扩展。可通过设置最大和最小尺寸来限制可以接受的控件尺寸范围。
- 不应使用屏幕坐标指定元素的位置。 元素应当由它们的窗口根据它们的尺寸、顺序及(可选的)其他特定于具体布局容器的信息进行排列。如果需要在元素之间添加空白空间,可使用 Margin 属性。
- 布局窗口的子元素”共享“可用的空间。 如果空间允许,布局容器会根据每个元素的内容尽可能为元素设置更合理的尺寸。它们还会向一个或多个子元素分配多余的空间。
- 可嵌套的布局容器。 典型的用户界面使用 Grid 面板作为开始,Grid 面板是 WPF 中功能最强大的容器,Grid 面板可包含其他布局容器,包含的这些容器以更小的分组排列元素,比如带有标题的文本框、列表框中的项、工具栏上的图标以及一列按钮等。
布局过程
WPF 布局报矿两个阶段:测量(measure)阶段和排列(arrange)阶段。
👀 ScrollViewer
控件提供滚动支持。
布局容器
所有的布局容器都继承自 System.Windows.Controls.Panel
抽象类的面板。
Panel 的三个共有属性:
- Background:背景色
- Children:面板中存储的条目集合
- IsItemsHost:该属性是一个布尔值,如果面板用于显示与 ItemsControl 控件关联的项,该属性值为 true.
💡 如果需要创建自定义容器(自定义的布局方式),就需要重写继承自 FrameworkElement 类的 MeasureOverride() 和 ArrangeOverride()方法。
核心布局面板
- StackPanel
- WarpPanel
- DockPanel:LastChildFill="True"
- Grid:ShowGridLines="True"、UseLayoutRounding="True" 布局舍入、GridSplitter 分割条、Grid.IsShareSizeScope="True" 共享尺寸组
- UniformGrid
- Canvas
💡 关于布局舍入
应设置为UseLayoutRounding
true
根元素。 布局系统将子坐标添加到父坐标;因此,如果父坐标不在像素边界上,则子坐标也不在像素边界上。 如果 UseLayoutRounding 不能在根目录设置,请在子级上设置 SnapsToDevicePixels 以获取所需的效果。
参考自:
FrameworkElement.UseLayoutRounding 属性 (System.Windows) | Microsoft Learn
UIElement.SnapsToDevicePixels 属性 (System.Windows) | Microsoft Learn
UIElement.UseLayoutRounding 属性
获取或设置一个值,该值确定对象及其可视化子树的呈现是否应使用将呈现与整像素对齐的舍入行为。
(一般在容器元素上设置, 发生在Measure&Arrange期间)
UIElement.SnapsToDevicePixels 属性
获取或设置一个值,该值决定呈现元素期间是否应使用设备特定的像素设置。这是一个依赖项属性。
(一般在根元素设置, 发生在Render, 不是容器元素)
其他的起到辅助布局的元素:
- 💡ViewBox
- Border:Background、BorderBrush、BorderThickness、CornerRadius、Padding
- TabPanel
- ToolbarPanel
- ToolbarOverflowPanel
- ❓VirtualizingStackPanel
- InkCanvas
- ❓Expander
常用的布局属性
- HorizontalAlignment: Center、Left、Right或Stretch
- VerticalAlignment
- Margin
- MinWidth 和 MinHeight
- MaxWidth 和 MaxHeight
- Width 和 Height
ActualHeight 和 ActualWidth 指的是元素实际的尺寸,而不是定义的尺寸
💡 自动改变尺寸的窗口
Window.SizeToCentent: 可设定的值有 WindthAndHeight、Width、Height
GridSplitter 分割条
特殊属性说明:
- ShowsPreview="True",如果为fase,在拖动的时候会实时的显示分割栏大小,如果为true时,则会显示一个灰色的阴影,在松开鼠标时都会进行分割大小。
- DragIncrement: 分割移动时的幅度值。
Z顺序
Canvas.ZIndex、Panel.ZIndex
InkCanvas
支持画线、选中、手势等功能。具体可查官方文档。
Visibility
- Visible 显示
- Collapsed 元素不显示,也不占用任何空间
- Hidden 元素不显示,但保留空间。