WPF - 樣式

上一頁
下一頁

.NET 框架提供了多種策略來個性化和自定義應用程式的外觀。樣式使我們能夠靈活地設定物件的一些屬性，並跨多個物件重用這些特定設定，以獲得一致的外觀。

  • 在樣式中，您只能設定物件的現有屬性，例如高度、寬度、字型大小等。

  • 只能指定控制元件的預設行為。

  • 可以在單個樣式中新增多個屬性。

樣式用於為一組控制元件提供統一的外觀。隱式樣式用於將外觀應用於給定型別的所有控制元件，並簡化應用程式。想象一下三個按鈕，它們都必須外觀相同，相同的寬度和高度，相同的字型大小，相同的前景顏色等。我們可以在按鈕元素本身設定所有這些屬性，對於所有按鈕來說，這仍然還可以。請檢視下圖。

Styles

但在實際應用程式中，您通常會有更多需要外觀完全相同的控制元件。當然，不僅僅是按鈕，您通常希望文字塊、文字框和組合框等在整個應用程式中外觀相同。當然，一定有更好的方法來實現這一點，這就是所謂的**樣式**。您可以將樣式視為一種方便的方法，可以將一組屬性值應用於多個元素。請檢視下圖。

Style is Defined

示例

讓我們來看一個簡單的例子來理解這個概念。首先建立一個新的 WPF 專案。

  • 從工具箱將三個按鈕拖到設計視窗。

  • 下面的 XAML 程式碼建立了三個按鈕並用一些屬性初始化它們。

<Window x:Class = "WPFStyle.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   xmlns:d = "http://schemas.microsoft.com/expression/blend/2008" 
   xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006" 
   xmlns:local = "clr-namespace: WPFStyle" 
   mc:Ignorable = "d" Title = "MainWindow" Height = "350" Width = "604"> 
	
   <StackPanel> 
      <Button Content = "Button1" Height = "30" Width = "80" 
         Foreground = "Blue" FontSize = "12" Margin = "10"/> 
      <Button Content = "Button2" Height = "30" Width = "80" 
         Foreground = "Blue" FontSize = "12" Margin = "10"/> 
      <Button Content = "Button3" Height = "30" Width = "80" 
         Foreground = "Blue" FontSize = "12" Margin = "10"/> 
   </StackPanel> 
	
</Window>

檢視上面的程式碼，您會看到所有按鈕的高度、寬度、前景顏色、字型大小和邊距屬性都相同。現在，當編譯並執行上述程式碼時，將顯示以下視窗。

Output of three buttons

現在讓我們看看同一個例子，但是這次我們將使用**樣式**。

<Window x:Class = "XAMLStyle.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   xmlns:d = "http://schemas.microsoft.com/expression/blend/2008" 
   xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006"
   xmlns:local = "clr-namespace:XAMLStyle" 
   mc:Ignorable = "d" Title = "MainWindow" Height = "350" Width = "604">
	
   <Window.Resources> 
      <Style x:Key = "myButtonStyle" TargetType = "Button"> 
         <Setter Property = "Height" Value = "30" /> 
         <Setter Property = "Width" Value = "80" /> 
         <Setter Property = "Foreground" Value = "Blue" /> 
         <Setter Property = "FontSize" Value = "12" /> 
         <Setter Property = "Margin" Value = "10" /> 
      </Style> 
   </Window.Resources> 
	
   <StackPanel> 
      <Button Content = "Button1" Style = "{StaticResource myButtonStyle}" /> 
      <Button Content = "Button2" Style = "{StaticResource myButtonStyle}" /> 
      <Button Content = "Button3" Style="{StaticResource myButtonStyle}" /> 
   </StackPanel> 
	
</Window>

樣式在資源字典中定義，每個樣式都有一個唯一的鍵識別符號和一個目標型別。在<style>內部，您可以看到為樣式中包含的每個屬性定義了多個 setter 標籤。

在上面的例子中，每個按鈕的所有公共屬性現在都在樣式中定義，然後透過使用 StaticResource 標記擴充套件設定 style 屬性，將樣式分配給每個按鈕，並賦予其唯一的鍵。

編譯並執行上述程式碼後，它將顯示以下視窗（相同的輸出）。

Same Output

這樣做的優勢是顯而易見的，我們可以在其範圍內隨處重用該樣式；如果我們需要更改它，我們只需在樣式定義中更改一次，而無需在每個元素上更改。

樣式的定義級別會立即限制該樣式的範圍。因此，範圍（您可以使用樣式的位置）取決於您定義它的位置。樣式可以在以下級別定義：

序號 級別和描述
1 控制元件級別

在控制元件級別定義的樣式只能應用於該特定控制元件。下面是一個控制元件級別的示例，其中按鈕和文字塊具有自己的樣式。
2 佈局級別

在任何佈局級別定義的樣式只能被該佈局及其子元素訪問。
3 視窗級別

在視窗級別定義的樣式可以被該視窗上的所有元素訪問。
4 應用程式級別

在應用程式級別定義的樣式可以在整個應用程式中訪問。讓我們來看同一個例子，但是在這裡，我們將樣式放在 app.xaml 檔案中，以便在整個應用程式中訪問它。
列印頁面
上一頁
下一頁
廣告