Style globalne w programie Xamarin.Forms
Style można udostępniać globalnie, dodając je do słownika zasobów aplikacji. Pomaga to uniknąć duplikowania stylów między stronami lub kontrolkami.
Tworzenie stylu globalnego w języku XAML
Domyślnie wszystkie Xamarin.Forms aplikacje utworzone na podstawie szablonu używają klasy App do implementowania podklasy Application
. Aby zadeklarować obiekt Style
na poziomie aplikacji, w aplikacji ResourceDictionary
przy użyciu języka XAML domyślna klasa aplikacji musi zostać zastąpiona klasą aplikacji XAML i skojarzonym kodem. Aby uzyskać więcej informacji, zobacz Praca z klasą aplikacji.
Poniższy przykład kodu przedstawia zadeklarowany Style
na poziomie aplikacji:
<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>
Definiuje ResourceDictionary
jeden jawny styl , buttonStyle
który będzie używany do ustawiania wyglądu Button
wystąpień. Jednak style globalne mogą być jawne lub niejawne.
Poniższy przykład kodu przedstawia stronę XAML stosującą buttonStyle
element do wystąpień strony Button
:
<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>
Spowoduje to wyświetlenie wyglądu pokazanego na poniższych zrzutach ekranu:
Aby uzyskać informacje na temat tworzenia stylów na stronie ResourceDictionary
, zobacz Jawne style i Niejawne style.
Zastępowanie stylów
Style niższe w hierarchii widoków mają pierwszeństwo przed zdefiniowanymi wyżej. Na przykład ustawienie wartości ustawianej Style
Button.TextColor
na Red
wartość na poziomie aplikacji zostanie zastąpione przez styl na poziomie strony ustawiony Button.TextColor
na Green
wartość . Podobnie styl poziomu strony zostanie zastąpiony stylem poziomu kontrolki. Ponadto jeśli Button.TextColor
właściwość jest ustawiana bezpośrednio na właściwości kontrolki, będzie to mieć pierwszeństwo przed dowolnymi stylami. Ten pierwszeństwo przedstawiono w poniższym przykładzie kodu:
<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>
Oryginalny element buttonStyle
, zdefiniowany na poziomie aplikacji, jest zastępowany przez buttonStyle
wystąpienie zdefiniowane na poziomie strony. Ponadto styl poziomu strony jest zastępowany przez poziom buttonStyle
kontrolki . Button
W związku z tym wystąpienia są wyświetlane z niebieskim tekstem, jak pokazano na poniższych zrzutach ekranu:
Tworzenie stylu globalnego w języku C#
Style
Wystąpienia można dodać do kolekcji aplikacji Resources
w języku C#, tworząc nowy ResourceDictionary
element , a następnie dodając Style
wystąpienia do ResourceDictionary
klasy , jak pokazano w poniższym przykładzie kodu:
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);
...
}
...
}
Konstruktor definiuje pojedynczy jawny styl stosowania do Button
wystąpień w całej aplikacji. Jawne Style
wystąpienia są dodawane do ResourceDictionary
metody przy użyciu Add
metody, określając key
ciąg, który ma odwoływać się do Style
wystąpienia. Wystąpienie Style
można następnie zastosować do dowolnych kontrolek poprawnego typu w aplikacji. Jednak style globalne mogą być jawne lub niejawne.
Poniższy przykład kodu przedstawia stronę języka C# stosującą buttonStyle
element do wystąpień strony Button
:
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"]
}
}
};
}
}
Element buttonStyle
jest stosowany do Button
wystąpień przez ustawienie ich Style
właściwości i kontroluje wygląd Button
wystąpień.