Estilos implícitos em Xamarin.Forms

Download Sample Baixar o exemplo

Um estilo implícito é aquele usado por todos os controles do mesmo TargetType, sem exigir que cada controle faça referência ao estilo.

Criar um estilo implícito em XAML

Para declarar um Style no nível da página, é ResourceDictionary necessário adicionar à página e, em seguida, uma ou mais Style declarações podem ser incluídas no ResourceDictionary. Um Style é implícito ao não especificar um x:Key atributo. Em seguida, o estilo será aplicado a elementos visuais que correspondem TargetType exatamente, mas não aos elementos derivados do TargetType valor.

O exemplo de código a seguir mostra um estilo implícito declarado em XAML em uma página ResourceDictionarye aplicado às instâncias da Entry página:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:Styles;assembly=Styles" x:Class="Styles.ImplicitStylesPage" Title="Implicit" IconImageSource="xaml.png">
    <ContentPage.Resources>
        <ResourceDictionary>
            <Style TargetType="Entry">
                <Setter Property="HorizontalOptions" Value="Fill" />
                <Setter Property="VerticalOptions" Value="CenterAndExpand" />
                <Setter Property="BackgroundColor" Value="Yellow" />
                <Setter Property="FontAttributes" Value="Italic" />
                <Setter Property="TextColor" Value="Blue" />
            </Style>
        </ResourceDictionary>
    </ContentPage.Resources>
    <ContentPage.Content>
        <StackLayout Padding="0,20,0,0">
            <Entry Text="These entries" />
            <Entry Text="are demonstrating" />
            <Entry Text="implicit styles," />
            <Entry Text="and an implicit style override" BackgroundColor="Lime" TextColor="Red" />
            <local:CustomEntry Text="Subclassed Entry is not receiving the style" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

Define ResourceDictionary um único estilo implícito aplicado às instâncias da Entry página. Ele Style é usado para exibir texto azul em um plano de fundo amarelo, ao mesmo tempo em que define outras opções de aparência. A Style página é adicionada ResourceDictionary sem especificar um x:Key atributo. Portanto, ela Style é aplicada a todas as Entry instâncias implicitamente, pois correspondem à TargetType propriedade exatamente Style . No entanto, o Style não é aplicado à CustomEntry instância, que é uma subclasse Entry. Isso resulta na aparência mostrada nas capturas de tela seguir:

Implicit Styles Example

Além disso, o quarto Entry substitui as propriedades e TextColor o BackgroundColor estilo implícito a valores diferentesColor.

Criar um estilo implícito no nível de controle

Além de criar estilos implícitos no nível da página, eles também podem ser criados no nível de controle, conforme mostrado no exemplo de código a seguir:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:Styles;assembly=Styles" x:Class="Styles.ImplicitStylesPage" Title="Implicit" IconImageSource="xaml.png">
    <ContentPage.Content>
        <StackLayout Padding="0,20,0,0">
            <StackLayout.Resources>
                <ResourceDictionary>
                    <Style TargetType="Entry">
                        <Setter Property="HorizontalOptions" Value="Fill" />
                        ...
                    </Style>
                </ResourceDictionary>
            </StackLayout.Resources>
            <Entry Text="These entries" />
            ...
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

Neste exemplo, o implícitoStyle é atribuído à Resources coleção do StackLayout controle. O estilo implícito pode ser aplicado ao controle e seus filhos.

Para obter informações sobre como criar estilos em um aplicativo ResourceDictionary, consulte Estilos Globais.

Criar um estilo implícito em C #

Style as instâncias podem ser adicionadas à coleção de Resources uma página em C# criando uma nova ResourceDictionarye, em seguida, adicionando as Style instâncias ao ResourceDictionary, conforme mostrado no exemplo de código a seguir:

public class ImplicitStylesPageCS : ContentPage
{
    public ImplicitStylesPageCS ()
    {
        var entryStyle = new Style (typeof(Entry)) {
            Setters = {
                ...
                new Setter { Property = Entry.TextColorProperty, Value = Color.Blue }
            }
        };

        ...
        Resources = new ResourceDictionary ();
        Resources.Add (entryStyle);

        Content = new StackLayout {
            Children = {
                new Entry { Text = "These entries" },
                new Entry { Text = "are demonstrating" },
                new Entry { Text = "implicit styles," },
                new Entry { Text = "and an implicit style override", BackgroundColor = Color.Lime, TextColor = Color.Red },
                new CustomEntry  { Text = "Subclassed Entry is not receiving the style" }
            }
        };
    }
}

O construtor define um único estilo implícito aplicado às instâncias da Entry página. Ele Style é usado para exibir texto azul em um plano de fundo amarelo, ao mesmo tempo em que define outras opções de aparência. A Style página é adicionada ResourceDictionary sem especificar uma key cadeia de caracteres. Portanto, ela Style é aplicada a todas as Entry instâncias implicitamente, pois correspondem à TargetType propriedade exatamente Style . No entanto, o Style não é aplicado à CustomEntry instância, que é uma subclasse Entry.

Aplicar um estilo a tipos derivados

A Style.ApplyToDerivedTypes propriedade permite que um estilo seja aplicado a controles derivados do tipo base referenciado pela TargetType propriedade. Portanto, definir essa propriedade para true habilitar um único estilo para direcionar vários tipos, desde que os tipos derivam do tipo base especificado na TargetType propriedade.

O exemplo a seguir mostra um estilo implícito que define a cor da tela de fundo das Button instâncias como vermelho:

<Style TargetType="Button"
       ApplyToDerivedTypes="True">
    <Setter Property="BackgroundColor"
            Value="Red" />
</Style>

Colocar esse estilo em um nível ResourceDictionary de página resultará na aplicação de todas as instâncias na página e também a todos os Button controles que derivam de Button. No entanto, se a ApplyToDerivedTypes propriedade permanecesse não configurada, o estilo só seria aplicado a Button instâncias.

Este é o código C# equivalente:

var buttonStyle = new Style(typeof(Button))
{
    ApplyToDerivedTypes = true,
    Setters =
    {
        new Setter
        {
            Property = VisualElement.BackgroundColorProperty,
            Value = Color.Red
        }
    }
};

Resources = new ResourceDictionary { buttonStyle };