Styles explicites dans Xamarin.Forms
Un style explicite est un style qui est appliqué de manière sélective aux contrôles en définissant leurs propriétés de style.
Créer un style explicite en XAML
Pour déclarer une Style déclaration au niveau de la page, une ResourceDictionary doit être ajoutée à la page, puis une ou plusieurs Style déclarations peuvent être incluses dans le ResourceDictionary. Un Style est rendu explicite en donnant à sa déclaration un attribut x:Key, qui lui donne une clé descriptive dans le ResourceDictionary. Les styles explicites doivent ensuite être appliqués à des éléments visuels spécifiques en définissant leurs propriétés Style.
L’exemple de code suivant montre des styles explicites déclarés en XAML dans les instances d’une ResourceDictionary page et appliqués aux instances de Label la page :
<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>
Définit ResourceDictionary trois styles explicites appliqués aux instances de la Label page. Chacun Style est utilisé pour afficher du texte dans une couleur différente, tout en définissant également la taille de police et les options de disposition horizontale et verticale. Chaque Style est appliqué à un Label différent en définissant ses propriétés Style à l’aide de l’extension de balisage StaticResource. Cela donne l’affichage illustré dans les captures d’écran suivantes :
En outre, la finale Label a une Style application à celle-ci, mais remplace également la TextColor propriété par une Color autre valeur.
Créer un style explicite au niveau du contrôle
En plus de créer des styles explicites au niveau de la page, ils peuvent également être créés au niveau du contrôle, comme illustré dans l’exemple de code suivant :
<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>
Dans cet exemple, les instances explicites Style sont affectées à la Resources collection du StackLayout contrôle. Les styles peuvent ensuite être appliqués au contrôle et à ses enfants.
Pour plus d’informations sur la création de styles dans les ResourceDictionarystyles d’une application, consultez Styles globaux.
Créer un style explicite en C#
Style Les instances peuvent être ajoutées à la collection d’une Resources page en C# en créant un nouveau ResourceDictionary, puis en ajoutant les Style instances au ResourceDictionaryfichier , comme illustré dans l’exemple de code suivant :
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 }
}
};
}
}
Le constructeur définit trois styles explicites appliqués aux instances de la Label page. Chaque explicite Style est ajouté à l’utilisation ResourceDictionary de la Add méthode, en spécifiant une key chaîne à faire référence à l’instance Style . Chacun d’eux Style est appliqué à un autre Label en définissant leurs Style propriétés.
Toutefois, il n’y a aucun avantage à utiliser ici ResourceDictionary . Au lieu de cela, Style les instances peuvent être affectées directement aux Style propriétés des éléments visuels requis, et elles ResourceDictionary peuvent être supprimées, comme illustré dans l’exemple de code suivant :
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 }
}
};
}
}
Le constructeur définit trois styles explicites appliqués aux instances de la Label page. Chacun Style est utilisé pour afficher du texte dans une couleur différente, tout en définissant également la taille de police et les options de disposition horizontale et verticale. Chacun d’eux Style est appliqué à un autre Label en définissant ses Style propriétés. En outre, la finale Label a une Style application à celle-ci, mais remplace également la TextColor propriété par une Color autre valeur.