Sdílet prostřednictvím


Explicitní styly v Xamarin.Forms

Explicitní styl je ten, který je selektivně použit u ovládacích prvků nastavením jejich vlastností Styl.

Vytvoření explicitního stylu v XAML

Chcete-li deklarovat Style na úrovni stránky, ResourceDictionary musí být na stránku přidána jedna nebo více Style deklarací lze zahrnout do ResourceDictionarysouboru . A Style je explicitní poskytnutím jeho deklarace x:Key atributu, který mu dává popisný klíč v objektu ResourceDictionary. Explicitní styly se pak musí použít u konkrétních vizuálních prvků nastavením jejich Style vlastností.

Následující příklad kódu ukazuje explicitní styly deklarované v XAML na stránce ResourceDictionary a použité na instance stránky Label :

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Styles.ExplicitStylesPage" Title="Explicit" IconImageSource="xaml.png">
    <ContentPage.Resources>
        <ResourceDictionary>
            <Style x:Key="labelRedStyle" TargetType="Label">
                <Setter Property="HorizontalOptions"
                        Value="Center" />
                <Setter Property="VerticalOptions"
                        Value="CenterAndExpand" />
                <Setter Property="FontSize" Value="Large" />
                <Setter Property="TextColor" Value="Red" />
            </Style>
            <Style x:Key="labelGreenStyle" TargetType="Label">
                ...
                <Setter Property="TextColor" Value="Green" />
            </Style>
            <Style x:Key="labelBlueStyle" TargetType="Label">
                ...
                <Setter Property="TextColor" Value="Blue" />
            </Style>
        </ResourceDictionary>
    </ContentPage.Resources>
    <ContentPage.Content>
        <StackLayout Padding="0,20,0,0">
            <Label Text="These labels"
                   Style="{StaticResource labelRedStyle}" />
            <Label Text="are demonstrating"
                   Style="{StaticResource labelGreenStyle}" />
            <Label Text="explicit styles,"
                   Style="{StaticResource labelBlueStyle}" />
            <Label Text="and an explicit style override"
                   Style="{StaticResource labelBlueStyle}"
                   TextColor="Teal" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

Definuje ResourceDictionary tři explicitní styly, které se použijí na instance stránky Label . Každý z nich Style slouží k zobrazení textu v jiné barvě a zároveň nastavení velikosti písma a možností vodorovného a svislého rozložení. Každý Style se použije na jiný Label nastavením jeho Style vlastností pomocí StaticResource rozšíření značek. Výsledkem je vzhled zobrazený na následujících snímcích obrazovky:

Příklad explicitních stylů

Kromě toho se na ni použije final Style Label, ale také přepíše TextColor vlastnost na jinou Color hodnotu.

Vytvoření explicitního stylu na úrovni ovládacího prvku

Kromě vytváření explicitních stylů na úrovni stránky je možné je vytvořit také na úrovni ovládacího prvku, jak je znázorněno v následujícím příkladu kódu:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Styles.ExplicitStylesPage" Title="Explicit" IconImageSource="xaml.png">
    <ContentPage.Content>
        <StackLayout Padding="0,20,0,0">
            <StackLayout.Resources>
                <ResourceDictionary>
                    <Style x:Key="labelRedStyle" TargetType="Label">
                      ...
                    </Style>
                    ...
                </ResourceDictionary>
            </StackLayout.Resources>
            <Label Text="These labels" Style="{StaticResource labelRedStyle}" />
            ...
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

V tomto příkladu jsou explicitní Style instance přiřazeny kolekci Resources StackLayout ovládacího prvku. Styly se pak dají použít u ovládacího prvku a jeho podřízených položek.

Informace o vytváření stylů v aplikaci ResourceDictionarynaleznete v tématu Globální styly.

Vytvoření explicitního stylu v jazyce C#

Style Instance je možné přidat do kolekce stránky Resources v jazyce C# vytvořením nové ResourceDictionaryinstance a následným přidáním Style instancí do objektu ResourceDictionary, jak je znázorněno v následujícím příkladu kódu:

public class ExplicitStylesPageCS : ContentPage
{
    public ExplicitStylesPageCS ()
    {
        var labelRedStyle = new Style (typeof(Label)) {
            Setters = {
                ...
                new Setter { Property = Label.TextColorProperty, Value = Color.Red    }
            }
        };
        var labelGreenStyle = new Style (typeof(Label)) {
            Setters = {
                ...
                new Setter { Property = Label.TextColorProperty, Value = Color.Green }
            }
        };
        var labelBlueStyle = new Style (typeof(Label)) {
            Setters = {
                ...
                new Setter { Property = Label.TextColorProperty, Value = Color.Blue }
            }
        };

        Resources = new ResourceDictionary ();
        Resources.Add ("labelRedStyle", labelRedStyle);
        Resources.Add ("labelGreenStyle", labelGreenStyle);
        Resources.Add ("labelBlueStyle", labelBlueStyle);
        ...

        Content = new StackLayout {
            Children = {
                new Label { Text = "These labels",
                            Style = (Style)Resources ["labelRedStyle"] },
                new Label { Text = "are demonstrating",
                            Style = (Style)Resources ["labelGreenStyle"] },
                new Label { Text = "explicit styles,",
                            Style = (Style)Resources ["labelBlueStyle"] },
                new Label {    Text = "and an explicit style override",
                            Style = (Style)Resources ["labelBlueStyle"], TextColor = Color.Teal }
            }
        };
    }
}

Konstruktor definuje tři explicitní styly, které se použijí na instance stránky Label . Každý explicitní Style se přidá do ResourceDictionary metody pomocí Add metody a určí key řetězec, který bude odkazovat na Style instanci. Každá z nich Style se použije na jinou Label nastavením jejich Style vlastností.

Použití zde však nemá žádnou výhodu ResourceDictionary . Style Místo toho je možné instance přiřadit přímo k vlastnostem Style požadovaných vizuálních prvků a ResourceDictionary je možné je odebrat, jak je znázorněno v následujícím příkladu kódu:

public class ExplicitStylesPageCS : ContentPage
{
    public ExplicitStylesPageCS ()
    {
        var labelRedStyle = new Style (typeof(Label)) {
            ...
        };
        var labelGreenStyle = new Style (typeof(Label)) {
            ...
        };
        var labelBlueStyle = new Style (typeof(Label)) {
            ...
        };
        ...
        Content = new StackLayout {
            Children = {
                new Label { Text = "These labels", Style = labelRedStyle },
                new Label { Text = "are demonstrating", Style = labelGreenStyle },
                new Label { Text = "explicit styles,", Style = labelBlueStyle },
                new Label { Text = "and an explicit style override", Style = labelBlueStyle,
                            TextColor = Color.Teal }
            }
        };
    }
}

Konstruktor definuje tři explicitní styly, které se použijí na instance stránky Label . Každý z nich Style slouží k zobrazení textu v jiné barvě a zároveň nastavení velikosti písma a možností vodorovného a svislého rozložení. Každý Style se použije na jiný Label nastavením jeho Style vlastností. Kromě toho se na ni použije final Style Label, ale také přepíše TextColor vlastnost na jinou Color hodnotu.