Xamarin.Forms 用户界面——控件——Style——介绍

样式简介

PDF用于离线使用

• 下载PDF

相关文章：

• XAML标记扩展

相关API：

• 样式
• 二传手

让我们知道你对此的感受

最后更新：2016年4月

样式允许定制视觉元素的外观。为特定类型定义样式，并包含该类型可用属性的值。

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"
    Icon="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";
        Icon = "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

具有a 

Property

和a 

Value

。它

Property

是应用于样式的元素的bindable属性的名称，

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>           

为了应用a 

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中包含的内置样式。

什么是StyleId？

在Xamarin.Forms 2.2之前，该

StyleId

属性用于识别UI测试中的识别应用程序中的各个元素，以及像Pixate这样的主题引擎。但是，Xamarin.Forms 2.2引入了该

AutomationId

属性，该属性已取代该

StyleId

属性。有关更多信息，请参阅使用Xamarin.UITest和测试云自动化Xamarin.Forms测试。

概要

Xamarin.Forms应用程序通常包含具有相同外观的多个控件。设置每个单独控件的外观可能是重复的并且容易出错。相反，可以创建通过控件类型可用的分组和设置属性自定义控件外观的样式。