Estilos Globais em Xamarin.Forms
Os estilos podem ser disponibilizados globalmente adicionando-os ao dicionário de recursos do aplicativo. Isso ajuda a evitar a duplicação de estilos entre páginas ou controles.
Criar um estilo global em XAML
Por padrão, todos os Xamarin.Forms aplicativos criados a partir de um modelo usam a classe App para implementar a Application subclasse. Para declarar um Style no nível do aplicativo, no uso de ResourceDictionary XAML do aplicativo, a classe App padrão deve ser substituída por uma classe de Aplicativo XAML e code-behind associado. Para obter mais informações, consulte Trabalhando com a classe de aplicativo.
O exemplo de código a seguir mostra um Style declarado no nível do aplicativo:
<Application xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Styles.App">
<Application.Resources>
<ResourceDictionary>
<Style x:Key="buttonStyle" TargetType="Button">
<Setter Property="HorizontalOptions" Value="Center" />
<Setter Property="VerticalOptions" Value="CenterAndExpand" />
<Setter Property="BorderColor" Value="Lime" />
<Setter Property="BorderRadius" Value="5" />
<Setter Property="BorderWidth" Value="5" />
<Setter Property="WidthRequest" Value="200" />
<Setter Property="TextColor" Value="Teal" />
</Style>
</ResourceDictionary>
</Application.Resources>
</Application>
Isso ResourceDictionary define um único estilo explícito , buttonStyle, que será usado para definir a aparência das Button instâncias. No entanto, os estilos globais podem ser explícitos ou implícitos.
O exemplo de Button código a seguir mostra uma página XAML aplicando o buttonStyle às instâncias da página:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Styles.ApplicationStylesPage" Title="Application" IconImageSource="xaml.png">
<ContentPage.Content>
<StackLayout Padding="0,20,0,0">
<Button Text="These buttons" Style="{StaticResource buttonStyle}" />
<Button Text="are demonstrating" Style="{StaticResource buttonStyle}" />
<Button Text="application style overrides" Style="{StaticResource buttonStyle}" />
</StackLayout>
</ContentPage.Content>
</ContentPage>
Isso resulta na aparência mostrada nas capturas de tela seguir:
Para obter informações sobre como criar estilos em uma página, consulte Estilos explícitos ResourceDictionarye estilos implícitos.
Substituir estilos
Os estilos inferiores na hierarquia de exibição têm precedência sobre os definidos acima. Por exemplo, a definição de um Style que define Button.TextColor como Red no nível do aplicativo será substituída por um estilo de nível de página que define Button.TextColor como Green. Da mesma forma, um estilo de nível de página será substituído por um estilo de nível de controle. Além disso, se Button.TextColor for definido diretamente em uma propriedade de controle, isso terá precedência sobre quaisquer estilos. Essa precedência é demonstrada no exemplo de código a seguir:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Styles.ApplicationStylesPage" Title="Application" IconImageSource="xaml.png">
<ContentPage.Resources>
<ResourceDictionary>
<Style x:Key="buttonStyle" TargetType="Button">
...
<Setter Property="TextColor" Value="Red" />
</Style>
</ResourceDictionary>
</ContentPage.Resources>
<ContentPage.Content>
<StackLayout Padding="0,20,0,0">
<StackLayout.Resources>
<ResourceDictionary>
<Style x:Key="buttonStyle" TargetType="Button">
...
<Setter Property="TextColor" Value="Blue" />
</Style>
</ResourceDictionary>
</StackLayout.Resources>
<Button Text="These buttons" Style="{StaticResource buttonStyle}" />
<Button Text="are demonstrating" Style="{StaticResource buttonStyle}" />
<Button Text="application style overrides" Style="{StaticResource buttonStyle}" />
</StackLayout>
</ContentPage.Content>
</ContentPage>
O original buttonStyle, definido no nível do aplicativo, é substituído pela instância definida no nível da buttonStyle página. Além disso, o estilo de nível de página é substituído pelo nível buttonStylede controle . Portanto, as Button instâncias são exibidas com texto azul, conforme mostrado nas seguintes capturas de tela:
Criar um estilo global em C#
Style instâncias podem ser adicionadas à coleção do Resources aplicativo em C# criando um novo ResourceDictionarye, em seguida, adicionando as Style instâncias ao ResourceDictionary, conforme mostrado no exemplo de código a seguir:
public class App : Application
{
public App ()
{
var buttonStyle = new Style (typeof(Button)) {
Setters = {
...
new Setter { Property = Button.TextColorProperty, Value = Color.Teal }
}
};
Resources = new ResourceDictionary ();
Resources.Add ("buttonStyle", buttonStyle);
...
}
...
}
O construtor define um único estilo explícito para aplicar a Button instâncias em todo o aplicativo. Instâncias explícitasStyle são adicionadas ao uso do ResourceDictionaryAdd método, especificando uma key cadeia de caracteres para fazer referência à Style instância. A Style instância pode então ser aplicada a quaisquer controles do tipo correto no aplicativo. No entanto, os estilos globais podem ser explícitos ou implícitos.
O exemplo de Button código a seguir mostra uma página C# aplicando o às buttonStyle instâncias da página:
public class ApplicationStylesPageCS : ContentPage
{
public ApplicationStylesPageCS ()
{
...
Content = new StackLayout {
Children = {
new Button { Text = "These buttons", Style = (Style)Application.Current.Resources ["buttonStyle"] },
new Button { Text = "are demonstrating", Style = (Style)Application.Current.Resources ["buttonStyle"] },
new Button { Text = "application styles", Style = (Style)Application.Current.Resources ["buttonStyle"]
}
}
};
}
}
O buttonStyle é aplicado às Button instâncias definindo suas Style propriedades e controla a aparência das Button instâncias.