WPF学习笔记3——Layout之1

一、概述

了解XAML的基本之后，进入Layout的学习。Layout，即布局，可能需要用到几种不同的容器。每一种容器都有各自的逻辑。在用户界面的设计过程中，很多时候是在想办法使得界面更加吸引、实在、便捷。然而，如何使得布局能够很好地适应不同窗口是一个难点。以往，开发者使用基于坐标的方法定位布局和控件。如今，WPF虽然也可以使用这种方法，但是通常更好的做法是创建能够适应不同内容、语言和显示器分辨率的方法。下面简单介绍基本的布局、容器，并举几个例子加深了解。

二、几个概念

1.一个WPF窗体只能有一个元素（element）。为了添加更多的元素，使得程序更符合实际需要，需要放置一个容器并且添加其他元素进去。WPF中，布局取决于你所使用的容器。通常理想的WPF程序遵循以下几点原则（概念）：

i.元素（例如控件）不应该被指定大小，而是应该自我调整，以适应所在的容器。例如，一个按钮， 在其文字变多的时候，应该自动变大或变长。你可以设置容器的最大和最小大小（size）。

ii.元素不应该指定它所在的屏幕坐标位置，而是应该根据所在的容器、基于大小、顺序等等在容器中排列。如果你需要添加元素直接的空白，可以使用Margin属性来设置。

iii.很多时候，硬性规定大小和位置是不好的，因为这样限制了你的用户界面的本地化，并且更难处理动态变更的内容。

iv.布局容器可以被嵌入到其它布局容器当中，作为子容器。

v.布局容器可以分享它们的可用空间给它们的子容器。

2.布局过程。分两个阶段：测量阶段和排列阶段。在测量阶段，容器遍历子元素并了解它们的大小。在排列阶段，容器将其子元素放置到合适的位置。一个元素可能没有固定的大小，有时候容器不足够大，这时容器或元素调整以适应可视范围。当然，你也可以通过设置最小窗口大小来避免这种情况。布局容器不提供滚动（scrolling）功能。实际上，滚动功能是特定的内容控件（content control）——ScrollingViewer所支持的。

3.布局容器。所有WPF布局容器都是继承抽象类System.Windows.Controls.Panel。Panel类有三个公共属性：Background、Children、IsItemsHost。你也可以通过重载定义自己的布局容器。特别的，重载MeasureOverride()和ArrangeOverride()方法来改变容器在组织子元素时的测量阶段和排列阶段。自定义布局行为将在日后学习。由此可见，Panel基类提供的是一个起点，用来给其它更具特性的容器继承。WPF提供了一些继承自Panel的类。如同所有WPF控件和大多数可视元素，这些类都在命名空间System.Windows.Controls。常见的有以下几种：

StackPanel	栈面板。可以将元素排列成一行或者一列，每个元素各占一行或者一列。
WrapPanel	环绕面板。当元素布局到达边界时，可以自动换行。
DockPanel	停靠面板。可以将面板的某一边指定给每个元素，当面板大小变化时，按钮将根据指定的边进行停靠。
Grid	网格面板。以表格形式布局元素。（通常先设置Grid再放元素进去比较好）
UniformGrid	均布网格。 网格面板的子集。所有单元格大小相同。
Canvas	画布面板。用于设置元素的精确位置。

常见的面板属性如下：

HorizontalAlignment	水平校准。Center,Left,Right,Stretch
VerticalAlignment	垂直校准。Center,Top,Bottom,Stretch
Margin	边缘。设置元素边缘空白。
MinWidth/MinHeight	最小尺寸
MaxWidth/MaxHeight	最大尺寸
Width/Height	指定大小（不推荐）

动手摸索就理解了。相关细节参阅MSDN（http://msdn.microsoft.com/zh-cn/library/ms745058(v=vs.110).aspx）和（http://msdn.microsoft.com/zh-cn/library/ms751709(v=vs.110).aspx）。

日后介绍设置Stytle功能。

4.Border类（System.Windows.Controls.Border）：绘制边框或背景。常见的属性有：Background,BorderBrush,BorderThickness,CornerRadius,Padding。详见MSDN（http://msdn.microsoft.com/zh-cn/library/system.windows.controls.border(v=vs.110).aspx）。细节：Padding是Border与内容之间的空白，而Margin是Border外部的空白。