WPF基础之样式设置和模板化（一）

Windows Presentation Foundation (WPF) 样式设置和模板化是指一套功能（样式、模板、触发器和演示图板），应用程序、文档或用户界面 (UI) 的设计人员使用这些功能可以创建更好的视觉效果，也可以对其产品的统一外观进行标准化。尽管作者或设计人员可以对应用程序的外观逐个进行大量自定义操作，他们还是需要一个功能强大的样式设置和模板化模型，以便在应用程序内部和应用程序之间维护和共享外观。Windows Presentation Foundation (WPF) 就提供了这样的模型。

WPF 样式设置模型的另一个功能是实现表示形式与逻辑的分离。这意味着，在开发人员使用 C# 或 Visual Basic 进行逻辑编程时，设计人员只需使用 XAML 即可设计程序的外观。

本概述将讨论样式设置和模板化示例简介应用程序，该应用程序具有两个 TextBlock 元素，以及一个绑定到图像列表的 ListBox 控件：





本概述主要讨论该应用程序的样式设置和模板化方面，而不讨论任何数据绑定概念。

另外，了解资源也很重要，正是资源使得样式和模板得以重用。

样式基础知识
您可以将 Style 看作是将一组属性值应用到多个元素的捷径。例如，考虑下面的 TextBlock 元素及其默认外观：









通过直接对每个 TextBlock 元素设置 FontSize 和 FontFamily 等属性可以更改默认外观。但是，如果希望 TextBlock 元素可以共享某些属性，则可以在 XAML 文件的 Resources 节中创建一个 Style，如下所示：





将样式的 TargetType 设置为 TextBlock 类型时，该样式会应用于窗口中的所有 TextBlock 元素。

现在，TextBlock 元素的外观如下：




扩展样式
您可能希望两个 TextBlock 元素共享某些属性值（如 FontFamily 和居中的 HorizontalAlignment），同时还希望文本“我的图片”具有某些其他属性。在第一个样式的基础上创建一个新样式可以达到这一目的，如下所示：





请注意，已为上面的样式提供了 x:Key。若要应用该样式，请将 TextBlock 的 Style 属性设置为 x:Key 值，如下所示：





现在，此 TextBlock 样式的 HorizontalAlignment 值为 Center，FontFamily 值为 Comic Sans MS，FontSize 值为 26，Foreground 值设置为示例所示的 LinearGradientBrush。请注意，我们已重写了基础样式的 FontSize 值。如果有多个 Setter 对 Style 的同一属性进行设置，则最后声明的 Setter 优先。

下面演示 TextBlock 元素现在的外观：




此 TitleText 样式扩展了为 TextBlock 类型创建的样式。此外，使用 x:Key 值也可以扩展具有 x:Key 的样式。

TargetType 属性 (Property) 和 x:Key 属性 (Attribute) 的关系
如第一个示例所示，如果将 TargetType 属性设置为 TextBlock 而不为样式分配 x:Key，样式就会应用于所有 TextBlock 元素。这种情况下，x:Key 隐式设置为 {x:Type TextBlock}。这意味着，如果将 x:Key 值显式设置为 {x:Type TextBlock} 之外的任何值，Style 就不会自动应用于所有 TextBlock 元素。此时，必须通过使用 x:Key 值，将样式显式应用于 TextBlock 元素。如果样式位于资源部分，并且未设置样式的 TargetType 属性，则必须提供 x:Key。

除了提供 x:Key 的默认值之外，TargetType 属性还指定要应用 setter 属性的类型。如果未指定 TargetType，则必须通过语法 Property="ClassName.Property"，用类名限定 Setter 对象的属性。例如，必须将 Property 设置为 "TextBlock.FontSize" 或 "Control.FontSize"，而不要设置 Property="FontSize"。

此外，还应注意，很多 WPF 控件都是由其他 WPF 控件组合而成的。如果创建要应用于某个类型的所有控件的样式，可能会得到意想不到的结果。例如，如果针对 Window 中的 TextBlock 类型创建一个样式，则该样式会应用于窗口中的所有 TextBlock 控件，即使 TextBlock 是另一个控件（如 ListBox）的组成部分也不例外。

样式和资源
任何派生自 FrameworkElement 或 FrameworkContentElement 的元素都可以使用样式。声明样式的最常见方式是将样式作为 XAML 文件的 Resources 节中的资源，如前面的示例所示。由于样式是资源，因此同样遵循所有资源都适用的范围规则：样式的声明位置决定样式的应用范围。例如，如果在应用程序定义 XAML 文件的根元素中声明样式，则样式可在应用程序范围内使用。如果创建的是导航应用程序，并在该应用程序的某个 XAML 文件中声明样式，则该样式只能在该 XAML 文件中使用。

以编程方式设置样式
若要以编程方式向元素分配命名样式，请从资源集合中获取该样式，然后将其分配给元素的 Style 属性。请注意，资源集合中的项是 Object 类型，因此，将检索到的样式分配给 Style 属性之前，必须将该样式强制转换为 Style。例如，若要对名为 textblock1 的 TextBlock 设置定义的 TitleText 样式，请执行以下操作：





请注意，样式一旦应用，便会密封并且无法更改。如果要动态更改已应用的样式，必须创建一个新样式来替换现有样式。

您可以创建一个根据自定义逻辑选择要应用的样式的对象。

绑定、动态资源和事件处理程序
请注意，使用 Setter.Value 属性可以指定 绑定标记扩展或 DynamicResource 标记扩展。

到目前为止，我们只讨论了如何使用 setter 设置属性值。在样式中也可以指定事件处理程序。

数据模板
在本示例应用程序中，有一个绑定到照片列表的 ListBox 控件。





此 ListBox 当前的外观如下所示：





大多数控件都具有某种类型的内容，这些内容通常来自绑定到的数据。在本示例中，数据为照片列表。在 WPF 中，使用 DataTemplate 可以定义数据的可视表示形式。基本上，输入 DataTemplate 的内容决定了数据在呈现的应用程序中的外观。

在我们的示例应用程序中，每个自定义 Photo 对象都具有一个字符串类型的 Source 属性，该属性指定图像的文件路径。当前，照片对象显示为文件路径。

对于要显示为图像的照片，可以将 DataTemplate 作为资源创建：





请注意，DataType 属性与 Style 的 TargetType 属性非常相似。如果 DataTemplate 位于资源部分，并且将 DataType 属性指定为某个类型，也不为其分配 x:Key，则只要该类型出现，便会应用 DataTemplate。任何时候都可以为 DataTemplate 分配 x:Key，然后将其设置为 DataTemplate 类型的属性（如 ItemTemplate 属性或 ContentTemplate 属性）的 StaticResource。