Stili espliciti in Xamarin.Forms
Uno stile esplicito è uno applicato in modo selettivo ai controlli impostando le relative proprietà Style.
Creare uno stile esplicito in XAML
Per dichiarare un oggetto Style a livello di pagina, è necessario aggiungere un oggetto ResourceDictionary alla pagina e quindi includere una o più Style dichiarazioni in ResourceDictionary. Un Style oggetto viene reso esplicito assegnando alla relativa dichiarazione un x:Key attributo, che fornisce una chiave descrittiva in ResourceDictionary. Gli stili espliciti devono quindi essere applicati a elementi visivi specifici impostandone Style le proprietà.
L'esempio di codice seguente mostra gli stili espliciti dichiarati in XAML in una pagina ResourceDictionary e applicati alle istanze della Label pagina:
<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>
ResourceDictionary Definisce tre stili espliciti applicati alle istanze della Label pagina. Ognuno Style viene usato per visualizzare il testo in un colore diverso, impostando anche le opzioni di layout orizzontale e verticale e orizzontale. Ogni Style oggetto viene applicato a un oggetto diverso Label impostandone Style le proprietà usando l'estensione di StaticResource markup. Il risultato è l'aspetto illustrato negli screenshot seguenti:
Inoltre, l'ultima Label ha un Style oggetto applicato, ma esegue anche l'override della TextColor proprietà su un valore diverso Color .
Creare uno stile esplicito a livello di controllo
Oltre a creare stili espliciti a livello di pagina, possono anche essere creati a livello di controllo, come illustrato nell'esempio di codice seguente:
<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>
In questo esempio, le istanze esplicite Style vengono assegnate alla Resources raccolta del StackLayout controllo . Gli stili possono quindi essere applicati al controllo e ai relativi elementi figlio.
Per informazioni sulla creazione di ResourceDictionarystili in un'applicazione, vedere Stili globali.
Creare uno stile esplicito in C#
Style È possibile aggiungere istanze alla raccolta di Resources una pagina in C# creando un nuovo ResourceDictionaryoggetto e quindi aggiungendo le Style istanze a ResourceDictionary, come illustrato nell'esempio di codice seguente:
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 }
}
};
}
}
Il costruttore definisce tre stili espliciti applicati alle istanze della Label pagina. Ogni oggetto esplicito Style viene aggiunto all'oggetto ResourceDictionary usando il Add metodo , specificando una key stringa per fare riferimento all'istanza Style di . Ogni Style oggetto viene applicato a un oggetto diverso Label impostando le relative Style proprietà.
Tuttavia, non esiste alcun vantaggio nell'uso di un oggetto ResourceDictionary qui. Le istanze possono invece Style essere assegnate direttamente alle Style proprietà degli elementi visivi necessari e ResourceDictionary possono essere rimosse, come illustrato nell'esempio di codice seguente:
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 }
}
};
}
}
Il costruttore definisce tre stili espliciti applicati alle istanze della Label pagina. Ognuno Style viene usato per visualizzare il testo in un colore diverso, impostando anche le opzioni di layout orizzontale e verticale e orizzontale. Ogni Style oggetto viene applicato a un oggetto diverso Label impostandone Style le proprietà. Inoltre, l'ultima Label ha un Style oggetto applicato, ma esegue anche l'override della TextColor proprietà su un valore diverso Color .