Поделиться через

Общие сведения о 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 является обязательным. В следующем примере кода показан явный стиль (обратите внимание x:Keyна ), созданный в XAML:

<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.

Примечание.

Что такое StyleId?

Xamarin.Forms До 2.2 StyleId свойство использовалось для идентификации отдельных элементов в приложении для идентификации в тестировании пользовательского интерфейса и в обработчиках тем, таких как Pixate. Xamarin.Forms Однако 2.2 ввело AutomationId свойство, которое заменяло StyleId свойство.