WPF 樣式和模板涉及一組功能（樣式、模板、觸發(fā)器和故事板）模板概念翻譯，允許開發(fā)人員和設(shè)計(jì)人員創(chuàng)建具有視覺吸引力的效果并為產(chǎn)品創(chuàng)建一致的界面。雖然開發(fā)人員和設(shè)計(jì)人員可以根據(jù)廣泛的應(yīng)用程序自定義界面。為了允許應(yīng)用程序表面的維護(hù)和共享，需要強(qiáng)大的樣式和模板模型。WPF 提供了這種模型。

WPF 風(fēng)格模型的另一個(gè)特點(diǎn)是表現(xiàn)層和邏輯層的分離。這意味著設(shè)計(jì)人員只能使用XAML 來完成應(yīng)用程序接口，同時(shí)開發(fā)人員可以使用C# 或VB 來完成程序的邏輯。

本概述側(cè)重于應(yīng)用程序樣式和模板，不討論數(shù)據(jù)綁定的概念。

此外，了解資源也很重要。資源使樣式和模板能夠被重用。

本主題包含以下部分：

樣式和模板示例

風(fēng)格基礎(chǔ)

數(shù)據(jù)模板

控制模板

觸發(fā)器

共享資源和主題

相關(guān)話題

樣式和模板示例

概述中使用的代碼示例基于一些簡單的照片，如下所示：

這個(gè)簡單的圖片示例使用樣式和模板來創(chuàng)建引人入勝的用戶體驗(yàn)。此示例有兩個(gè) Textblock 元素和一個(gè)綁定到一組圖片的 ListBox 控件。

風(fēng)格基礎(chǔ)

您可以將 Style 視為應(yīng)用一組屬性值的便捷??方式，而不僅僅是一個(gè)元素?？紤]以下 TextBlock 元素及其默認(rèn)界面。

我的照片

看看我的新照片！

您可以通過直接設(shè)置TextBox 的屬性來更改默認(rèn)界面，例如FontSize 和FontFamily。但是，如果您希望 Textblock 元素共享某些屬性，則可以在 XAML 文件資源部分中創(chuàng)建樣式，如下所示：

當(dāng)您將樣式的 TargetType 設(shè)置為 TextBlock 時(shí)，該樣式將應(yīng)用于所有窗口 TextBlock 元素。

TextBlock元素的界面如下：

款式延伸

也許您希望兩個(gè) TextBlock 元素共享相同的屬性值，例如 FontFamily 和 Horizo??ntalAlignment，但您還希望“我的圖片”具有一些附加屬性。您可以根據(jù)第一個(gè)樣式創(chuàng)建新樣式，如下所示：

目標(biāo)類型=“文本塊”

X：鍵=“標(biāo)題文本”>

請注意，上面的樣式給出了 x:Key。為了應(yīng)用此樣式，您將樣式的屬性設(shè)置為 TextBlock 并需要 x:Key 值，如下所示：

我的照片

看看我的照片！

現(xiàn)在TextBlock樣式中間有Horizo??ntalAlignment，F(xiàn)ontFamily的值為Comic Sans MS，F(xiàn)ontSize的值為26。Foreground的值為LinearGradientBrush，如下例所示。請注意，它會覆蓋父類型的 FontSize。如果樣式中有多個(gè) setter，則*后聲明的 setter 優(yōu)先。

TextBlock 元素如下所示：

TitleText 樣式擴(kuò)展了用于 TextBlock 的樣式。您還可以使用 x:Key 值將樣式擴(kuò)展為具有 x:Key。

TargetType 屬性和 x:Key 屬性的關(guān)系

如第一個(gè)示例所示，將 TargetType 屬性設(shè)置為 TextBlock 而不將 x:Key 分配給樣式將導(dǎo)致樣式應(yīng)用于所有 TextBlock 元素。在這個(gè)例子中，x:Key 被隱式設(shè)置為 {x:Type TextBlock}，這意味著如果你將 x:Key 設(shè)置為另一種類型而不是 {x:Type TextBlock}，Style 將不會應(yīng)用于所有 TextBlock 元素. 也就是說，您必須將樣式應(yīng)用到 TextBlock。如果未為資源中的樣式設(shè)置目標(biāo)類型，則必須提供 x:Key。

為了為 x:Key 提供默認(rèn)值，TargetType 屬性指定了 set 屬性將應(yīng)用于哪些類型。如果未指定 TargetType，則必須使用類名來設(shè)置 Setter 對象中的屬性，例如，Property = "ClassName.Property"。例如，不要設(shè)置 Property = "FontSize"，而是將 Property 設(shè)置為 "TextBlock.FontSize" 或 "Control.FontSize"。

另請注意，許多 WPF 控件都是由 WPF 控件組成的。如果您想創(chuàng)建一個(gè)樣式以應(yīng)用于所有類型的控件，您可能會得到意想不到的結(jié)果。例如，如果您創(chuàng)建的樣式以窗口的 Textblock 類型為目標(biāo)，則該樣式將應(yīng)用于所有 TextBlock 控件，即使 TextBlock 是另一個(gè)控件（如 ListBox）的一部分。

樣式和資源

您可以在繼承自 FrameworkElement 和 FrameworkContentElement 的任何元素上使用樣式。*常用的方法是在 XAML 文件的資源部分將樣式聲明為資源，如上例所示。因?yàn)闃邮绞琴Y源，所以需要嚴(yán)格遵守所有應(yīng)用于資源的范圍規(guī)則；樣式聲明影響使用樣式的位置。例如，如果您在應(yīng)用程序根元素的 XAML 中聲明樣式，則該樣式可以應(yīng)用于應(yīng)用程序中的任何位置。如果您創(chuàng)建導(dǎo)航應(yīng)用程序并聲明樣式是應(yīng)用程序的 XAML 文件的一部分，則該樣式只能在 XAML 文件中使用。

以編程方式設(shè)置樣式

為了以編程方式為元素分配樣式名稱，從資源集中獲取樣式并將其分配給元素樣式屬性。請注意，資源集中的項(xiàng)目是對象類型。因此，您必須先檢索樣式樣式，然后再將其分配給樣式屬性。例如，將定義的 TitleText 樣式設(shè)置為名為 textblock1 的 TextBlock。請執(zhí)行以下操作：

Textblock1.Style = (Style)(this.Resources[“TitleText”]);

請注意，樣式一旦應(yīng)用，就會被封裝，無法更改。如果要動態(tài)更改已應(yīng)用的樣式。您必須創(chuàng)建一種新樣式來替換現(xiàn)有樣式。

您可以創(chuàng)建一個(gè)對象并根據(jù)自定義邏輯選擇要應(yīng)用的樣式，例如樣式選擇器。

綁定、動態(tài)資源和事件處理程序

請注意，您可以使用 Setter.Value 屬性來指定綁定標(biāo)記擴(kuò)展和動態(tài)資源標(biāo)記擴(kuò)展。

到目前為止這

概述僅討論使用 setter 來設(shè)置屬性值。您還可以指定事件處理程序的樣式。

數(shù)據(jù)模板

在這種情況下，有一個(gè) ListBox 控件綁定到一組照片。

背景=”銀色” 寬度=”600” 邊距=”10” SelectedIndex=”0”/>

當(dāng)前的 ListBox 如下所示：

大多數(shù)控件都有一些內(nèi)容，這些內(nèi)容通常與數(shù)據(jù)綁定。在這個(gè)例子中，數(shù)據(jù)是一組照片。在 WPF 中，您使用 DataTemplate 來定義數(shù)據(jù)的可視化表示?；旧希湃霐?shù)據(jù)模板的內(nèi)容決定了應(yīng)用程序中顯示的數(shù)據(jù)。

在我們的應(yīng)用示例中，每個(gè)自定義圖片對象都有一個(gè) Source 屬性來指定圖片的路徑。目前，圖片對象只出現(xiàn)在文件路徑中。

請注意，DataType 屬性與樣式的 TargetType 屬性非常相似。如果您的數(shù)據(jù)模板在資源部分中，當(dāng)您將 DataType 屬性指定為類型而不為其分配 x:Key 時(shí)，只要該類型出現(xiàn)，就會應(yīng)用 DataTemplate。您也可以選擇使用 x:Key 來分配 DataTemplate，然后將其設(shè)置為數(shù)據(jù)模板的 StaticResource 屬性，例如 ItemTemplate 屬性和 ContentTemplate 屬性。

本質(zhì)上，上例中的數(shù)據(jù)模板定義了只要是Photo對象，就應(yīng)該在Border中以圖片的形式呈現(xiàn)。使用這個(gè) DataTemplate，我們的應(yīng)用程序看起來像這樣：

數(shù)據(jù)模板還提供其他功能。例如，如果您呈現(xiàn)的數(shù)據(jù)集包含其他集，并且這些集使用 HeaderedItemsControl 類型，例如 Menu 或 TreeView，則存在一個(gè) HierarchicalDataTemplate。另一個(gè)數(shù)據(jù)模板功能是 DataTemplateSelector，它允許您根據(jù)自定義邏輯選擇數(shù)據(jù)模板。

控制模板

在 WPF 中，控件的控件模板定義了控件的接口。您可以通過為控件定義新的 ControlTemplate 來更改結(jié)構(gòu)和界面。在許多情況下，這為您提供了足夠的靈活性，因此您可以編寫自己的自定義控件。

觸發(fā)器

當(dāng)屬性值更改或引發(fā)事件時(shí)設(shè)置屬性和啟動操作（例如動畫）的觸發(fā)器。樣式、控件模板和數(shù)據(jù)模板都有 Triggers 屬性來設(shè)置觸發(fā)器。有各種類型的觸發(fā)器。

屬性觸發(fā)

觸發(fā)器是設(shè)置一個(gè)屬性值，或者根據(jù)某個(gè)屬性值啟動一個(gè)動作，稱為屬性觸發(fā)器。

為了聲明如何使用屬性觸發(fā)器，您可以使 ListBoxItem 部分透明，除非它被選中。下面的樣式將ListBoxItem的Opacity值設(shè)置為0.5. 當(dāng)IsSelected屬性值為true時(shí)，Opacity設(shè)置為1.0.

此示例使用 Trigger 來設(shè)置屬性值，但請注意 Trigger 類還具有 EnterActions 和 ExitActions 屬性來觸發(fā)操作的執(zhí)行。

注意ListBoxItem的MaxHeight屬性設(shè)置為75.如下圖，第三項(xiàng)被選中。

事件觸發(fā)器和故事板

另一種類型的觸發(fā)器是 EventTrigger，它根據(jù)一個(gè)事件啟動一組操作。下面的EventTrigger對象指定當(dāng)鼠標(biāo)進(jìn)入ListBoxItem時(shí)，在0.2s MaxHeight0.后變?yōu)?0.2s MaxHeight0.鼠標(biāo)離開選項(xiàng)時(shí)，該屬性恢復(fù)原值1S內(nèi)。注意不需要指定MouseLeave的值，這是因?yàn)閯赢嬁梢愿櫾贾怠?/p>

持續(xù)時(shí)間=”0:0:0.2”

Storyboard.TargetProperty="MaxHeight"

到=”90” />

持續(xù)時(shí)間=”0:0:1”

Storyboard.TargetProperty="MaxHeight" />

如下圖，鼠標(biāo)指向第三項(xiàng)：

多觸發(fā)器、數(shù)據(jù)觸發(fā)器、多數(shù)據(jù)觸發(fā)器

除了 Trigger 和 EventTrigger 之外，還有一些其他類型的觸發(fā)器。MultiTrigger 允許您根據(jù)多個(gè)條件設(shè)置屬性值。當(dāng)您的屬性是數(shù)據(jù)綁定時(shí)，請使用 DataTrigger 和 MultiDataTrigger。

共享資源和主題

典型的 WPF 程序在整個(gè)應(yīng)用程序中可能有多個(gè)用戶界面資源。通常，可以將這些資源集視為應(yīng)用程序的主題。WPF 支持將 UI 資源打包成主題，并通過資源字典將它們封裝到 ResouceDictionary 類中。

WPF 主題通過樣式和模板機(jī)制定義，WPF 公開任何元素的視覺效果。

WPF 主題資源存儲在嵌入式資源字典中。這些資源字典必須嵌入到簽名的程序集中，或者它們可以嵌入到與代碼相同的程序集中，或并排的程序集中。對于 PresentationFramewoek.dll，包含 WPF 控件和主題資源的程序集是一系列并排的程序集。

在尋找元素的樣式時(shí)，主題成為*后的位置。通常，搜索會從元素樹開始，尋找合適的資源模板概念翻譯，然后查看應(yīng)用資源集，*后查詢系統(tǒng)。這使應(yīng)用程序開發(fā)人員有機(jī)會在達(dá)到主題之前為樹和應(yīng)用程序級別的任何對象重新定義樣式。

您可以將資源字典定義為單獨(dú)的文件，使您能夠在多個(gè)應(yīng)用程序中使用主題。您還可以通過定義多個(gè)資源字典來創(chuàng)建可熱插拔的主題，為相同的資源提供不同的值。在應(yīng)用程序級別呈現(xiàn)這些樣式或資源是應(yīng)用程序皮膚的推薦方法。

為了共享這些資源，包括樣式和模板，以及跨應(yīng)用程序，您可以創(chuàng)建一個(gè) XAML 文件并定義一個(gè)資源字典。例如，檢查下面的說明，其中顯示了使用 ControlTemplate Sample 進(jìn)行樣式設(shè)置的一部分。

如果您看到示例中的 XAML 文件，您一定注意到該文件包含這句話：

<ResourceDictionary Source="Shared.xaml" />

這是shared.xaml，定義了一個(gè)資源字典，包含了一組樣式和畫筆資源，使控件具有一致的外觀。

參考：(VS.100).aspx

轉(zhuǎn)載于：