Xamarin.Forms樣式簡介

樣式允許自定義視覺元素的外觀。 樣式是針對特定類型所定義，並包含該類型上可用屬性的值。

Xamarin.Forms 應用程式通常包含多個具有相同外觀的控制件。 例如，應用程式可能會有多個 Label 具有相同字型選項和版面配置選項的實例，如下列 XAML 程式代碼範例所示：

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    x:Class="Styles.NoStylesPage"
    Title="No Styles"
    IconImageSource="xaml.png">
    <ContentPage.Content>
        <StackLayout Padding="0,20,0,0">
            <Label Text="These labels"
                   HorizontalOptions="Center"
                   VerticalOptions="CenterAndExpand"
                   FontSize="Large" />
            <Label Text="are not"
                   HorizontalOptions="Center"
                   VerticalOptions="CenterAndExpand"
                   FontSize="Large" />
            <Label Text="using styles"
                   HorizontalOptions="Center"
                   VerticalOptions="CenterAndExpand"
                   FontSize="Large" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

下列程式碼範例示範以 C# 建立的相等頁面：

public class NoStylesPageCS : ContentPage
{
    public NoStylesPageCS ()
    {
        Title = "No Styles";
        IconImageSource = "csharp.png";
        Padding = new Thickness (0, 20, 0, 0);

        Content = new StackLayout {
            Children = {
                new Label {
                    Text = "These labels",
                    HorizontalOptions = LayoutOptions.Center,
                    VerticalOptions = LayoutOptions.CenterAndExpand,
                    FontSize = Device.GetNamedSize (NamedSize.Large, typeof(Label))
                },
                new Label {
                    Text = "are not",
                    HorizontalOptions = LayoutOptions.Center,
                    VerticalOptions = LayoutOptions.CenterAndExpand,
                    FontSize = Device.GetNamedSize (NamedSize.Large, typeof(Label))
                },
                new Label {
                    Text = "using styles",
                    HorizontalOptions = LayoutOptions.Center,
                    VerticalOptions = LayoutOptions.CenterAndExpand,
                    FontSize = Device.GetNamedSize (NamedSize.Large, typeof(Label))
                }
            }
        };
    }
}

每個 Label 實例都有相同的屬性值，可控制 所 Label顯示的文字外觀。 這會導致下列螢幕擷取畫面中顯示的外觀：

設定每個個別控件的外觀可能會重複且容易發生錯誤。 相反地，可以建立定義外觀的樣式，然後套用至必要的控件。

建立樣式

Style 類別會將屬性值的集合分組到一個物件中，然後套用到多個視覺元素執行個體。 這有助於減少重複標記，並讓應用程式外觀更容易變更。

雖然樣式主要是針對以 XAML 為基礎的應用程式所設計，但它們也可以在 C# 中建立：

• Style 在 XAML 中建立的實體通常會定義在 ResourceDictionary 指派給 Resources 控件、頁面或 Resources 應用程式集合集合的 中。
• Style 在 C# 中建立的實體通常會定義於頁面的 類別中，或定義於可全域存取的類別中。

選擇要在何處定義 Style 會影響其可使用的位置：

• Style 在控件層級定義的實例只能套用至控件和其子系。
• Style 在頁面層級定義的實例只能套用至頁面和其子系。
• 在應用程式層級定義的 Style 執行個體可套用至整個應用程式。

每個 Style 執行個體都包含一或多個 Setter 物件的集合，其中每個 Setter 都有一項 Property 及一個 Value。 Property 為樣式所套用元素的可繫結屬性名稱，且 Value 為套用至屬性的值。

每個Style實體都可以明確或隱含：

• 明確Style實例的定義方式是指定 TargetType 和 x:Key 值，並將目標元素的 Style 屬性設定為x:Key參考。 如需明確樣式的詳細資訊，請參閱明確樣式。
• 隱含Style實例是藉由只TargetType指定 來定義。 然後， Style 實例會自動套用至該類型的所有專案。 請注意，的 TargetType 子類別不會自動 Style 套用 。 如需隱含樣式的詳細資訊，請參閱隱含樣式。

建立 Style 時，一律需要 TargetType 屬性。 下列程式代碼範例示範在 XAML 中建立的 明確 樣式（請注意 x:Key） ：

<Style x:Key="labelStyle" TargetType="Label">
    <Setter Property="HorizontalOptions" Value="Center" />
    <Setter Property="VerticalOptions" Value="CenterAndExpand" />
    <Setter Property="FontSize" Value="Large" />
</Style>

若要套用 Style，目標對象必須是 VisualElement 符合 TargetType 屬性值的 Style，如下列 XAML 程式代碼範例所示：

<Label Text="Demonstrating an explicit style" Style="{StaticResource labelStyle}" />

檢視階層中較低樣式的優先順序高於較高定義的樣式。 例如， Style 將 設定 Label.TextColor 在應用層級設定為 Red 的 ，將會由設定 Label.TextColor 為 Green的頁面層級樣式覆寫。 同樣地，頁面層級樣式會由控件層級樣式覆寫。 此外，如果 Label.TextColor 直接在控件屬性上設定，這會優先於任何樣式。

本節中的文章示範及說明如何建立和套用 明確 和 隱含 樣式、如何建立全域樣式、樣式繼承、如何在運行時間響應樣式變更，以及如何使用 內 Xamarin.Forms建的樣式。

相關連結

• XAML 標記延伸
• Style
• Setter