Wpf基础入门——控件(Control)

本篇文章学习于： 刘铁猛老师《深入浅出WPF》

控件到底是什么？#

WPF中是数据驱动UI , 数据是核心、是主动的；UI从属于数据并表达数据、是被动的。
Control是数据和行为的载体，而无需具有固定的形象。控件的派生关系如下：

WPF的内容模型#

各类内容模型详解#

我们把符合某类内容模型的UI元素称为一个族，每个族用它们共同基类来命名。

ContentControl 单一内容控件#

本族元素的特点如下：

• 均派生自 ContentControl 类。
• 它们都是控件（Control）。
• 内容属性的名称为Content。
• 只能由单一元素充当其内容。【例如：Button控件属于这一族，但如果你想让Button的Content既包含文字又包含图片是不行的，但是我们可以先用一个可以包含多个元素的布局控件把图片和文字包装起来，再把这个布局控件作为Button的内容就好了】

HeaderedContentControl 带标题的单一内容控件#

本族元素的特点如下：

• 它们都派生自 HeaderedContentControl 类，HeaderedContentControl 是 ContentControl 类的

派生类。

• 它们都是控件，用于显示带标题的数据。
• 除了用于显示主体内容的区域外，控件还具有一个显示标题(Header)的区域。
• 内容属性为Content和Header。
• 无论是Content还是Header都只能容纳一个元素作为其内容。

下面这个例子是一个以图标为Header . 以文字为主体内容的GroupBox , 效果如下所示。

ItemsControl 以条目集合为内容的控件#

本族元素的特点如下：

• 均派生自ItemsControl类。
• 它们都是控件，用于显示列表化的数据。
• 内容属性为Items或ItemsSource。
• 每种ItemsControl都对应有自己的条目容器(Item Container)

HeaderedItemsControl 带标题的以条目集合为内容的控件#

顾名思义，本族控件除了具有ItemsControl的特性外，还具显示标题的能力。
本族元素的特点如下：

• 均派生自 HeaderedItemsControl 类。
• 它们都是控件，用于显示列表化的数据，同时可以显示一个标题。
• 内容属性为 Items、ItemsSource 和 Header。

本族控件只有3 个：Menuitem 、 TreeViewitem、ToolBar。

Decorator 控件装饰元素#

本族中的元素是在UI上起装饰效果的。如可以使用Border元素为一些组织在一起的内容加个边框。如果需要组织在一起的内容能够自由缩放，则可使用ViewBox元素。
本族元素的特点如下：

• 均派生自Decorator类。
• 起UI装饰作用。
• 内容属性为 Child。
• 只能由单一元素充当内容。

TextBlock和TextBox 显示文本#

这两个控件最主要的功能是显示文本。TextBlock只能显示文本，不能编辑，所以又称静态文本。
TextBox则允许用户编辑其中的内容。
TextBlock虽然不能编辑内容，但可以使用丰富的印刷级的格式控制标记显示专业的排版效果。
TextBox不需要太多的格式显示，所以它的内容是简单的字符串，内容属性为Text。
TextBlock由于需要操纵格式，所以内容属性是Inlines （印刷中的“行”），同时，TextBlock也保留一个名为Text的属性，当简攀地显示一个字符串时，可以使用这个属性。

Shape 图形元素#

友好的用户界面离不开各种图形的搭配，Shape族元素（它们只是简单的视觉元素，不是控件）就是专门用来在UI 上绘制图形的一类元素。这类元素没有自己的内容，我们可以使用Fill 属性为它们设置填充效果，还可以使用Stroke属性为它们设置边线的效果。
本族元素的特点如下：

• 均派生自Shape类。
• 用于2D图形绘制。
• 无内容属性。
• 使用Fill属性设置填充，使用Stroke属性设置边线。

Panel 面板类元素#

之所以把Panel 族元素放在最后是因为这一族控件实在是太重要了一所有用于UI 布局的元素都属于这一族。
本族元素的特点如下：

• 均派生自Panel抽象类。
• 主要功能是控制UI布局。
• 内容属性为Children。
• 内容可以是多个元素，Panel元素将控制它们的布局。

UI布局（Layout）#

布局元素属于Panel 族，这一族元素的内容属性是Children , 即可以接受多个控件作为自己的内容并对这些控件进行布局控制。WPF 的布局理念就是把一个布局元素作为ContentControl或HeaderedContentControl族控件的Content，再在布局元素里添加要被布局的子级控件，如果UI局部需要更复杂的布局，那就在这个区域放置一个子级的布局元素，形成布局元素的嵌套。
WPF中的布局元素有如下几个：

• Grid：网格。可以自定义行和列并通过行列的数最、行髙和列宽来调整控件的布局。近似于HTML中的Table
• StackPanel：栈式面板。可将包含的元素在竖直或水平方向上排成•条直线，当移除一个元素后，后面的元素会自动向前移动以填充空缺。
• Canvas：画布。内部元素可以使用以像素为单位的绝对坐标进行定位，类似于WindowsForm编程的布局方式。
• DockPanel：泊靠式面板。内部元素可以选择泊靠方向，类似于在Windows Form编程中设置控件的Dock属性。
• WrapPanel：自动折行面板。内部元素在排满一行后能够自动折行，类似于HTML中的流式布局。