Verwenden von XAML-Markuperweiterungen

Beispiel herunterladen Das Beispiel herunterladen

XAML-Markuperweiterungen tragen dazu bei, die Leistungsfähigkeit und Flexibilität von XAML zu verbessern, indem Elementattribute aus einer Vielzahl von Quellen festgelegt werden können. Mehrere XAML-Markuperweiterungen sind Teil der XAML 2009-Spezifikation. Diese werden in XAML-Dateien mit dem üblichen x Namespacepräfix angezeigt und häufig mit diesem Präfix bezeichnet. In diesem Artikel werden die folgenden Markuperweiterungen erläutert:

  • x:Static – verweisen auf statische Eigenschaften, Felder oder Enumerationsmember.
  • x:Reference – Auf benannte Elemente auf der Seite verweisen.
  • x:Type – Legen Sie ein Attribut auf ein System.Type -Objekt fest.
  • x:Array – Erstellen eines Arrays von Objekten eines bestimmten Typs.
  • x:Null – Legen Sie ein Attribut auf einen Wert fest null .
  • OnPlatform – Anpassen der Darstellung der Benutzeroberfläche auf Plattformbasis.
  • OnIdiom – Anpassen der Darstellung der Benutzeroberfläche basierend auf dem Idiom des Geräts, auf dem die Anwendung ausgeführt wird.
  • DataTemplate – konvertiert einen Typ in einen DataTemplate.
  • FontImage – zeigt ein Schriftartensymbol in einer beliebigen Ansicht an, in der ein ImageSourceangezeigt werden kann.
  • AppThemeBinding – eine Ressource basierend auf dem aktuellen Systemdesign nutzen.

Zusätzliche XAML-Markuperweiterungen wurden in der Vergangenheit von anderen XAML-Implementierungen unterstützt und werden auch von Xamarin.Formsunterstützt. Diese werden in anderen Artikeln ausführlicher beschrieben:

  • StaticResource – Verweisen Sie auf Objekte aus einem Ressourcenwörterbuch, wie im Artikel Ressourcenwörterbücher beschrieben.
  • DynamicResource – Reagieren auf Änderungen in Objekten in einem Ressourcenwörterbuch, wie im Artikel Dynamische Stile beschrieben.
  • Binding – Stellen Sie eine Verknüpfung zwischen den Eigenschaften von zwei Objekten her, wie im Artikel Datenbindung beschrieben.
  • TemplateBinding– führt die Datenbindung aus einer Steuerelementvorlage aus, wie in den ArtikelsteuerelementvorlagenXamarin.Forms erläutert.
  • RelativeSource – legt die Bindungsquelle relativ zur Position des Bindungsziels fest, wie im Artikel Relative Bindungen erläutert.

Das RelativeLayout Layout verwendet die benutzerdefinierte Markuperweiterung ConstraintExpression. Diese Markuperweiterung wird im Artikel RelativeLayout beschrieben.

x:Static-Markuperweiterung

Die x:Static Markuperweiterung wird von der StaticExtension -Klasse unterstützt. Die -Klasse verfügt über eine einzelne Eigenschaft vom Member Typ string , die Sie auf den Namen einer öffentlichen Konstanten, statischen Eigenschaft, eines statischen Felds oder eines Enumerationsmembers festlegen.

Eine gängige Methode besteht x:Static darin, zunächst eine Klasse mit einigen Konstanten oder statischen Variablen zu definieren, z. B. diese kleine AppConstants Klasse im MarkupExtensions-Programm :

static class AppConstants
{
    public static double NormalFontSize = 18;
}

Auf der Seite x:Static Demo werden verschiedene Möglichkeiten zur Verwendung der x:Static Markuperweiterung veranschaulicht. Der ausführlichste Ansatz instanziiert die StaticExtension -Klasse zwischen Label.FontSize Eigenschaftselementtags:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:sys="clr-namespace:System;assembly=netstandard"
             xmlns:local="clr-namespace:MarkupExtensions"
             x:Class="MarkupExtensions.StaticDemoPage"
             Title="x:Static Demo">
    <StackLayout Margin="10, 0">
        <Label Text="Label No. 1">
            <Label.FontSize>
                <x:StaticExtension Member="local:AppConstants.NormalFontSize" />
            </Label.FontSize>
        </Label>

        ···

    </StackLayout>
</ContentPage>

Der XAML-Parser ermöglicht auch, dass die StaticExtension -Klasse als x:Staticabgekürzt wird:

<Label Text="Label No. 2">
    <Label.FontSize>
        <x:Static Member="local:AppConstants.NormalFontSize" />
    </Label.FontSize>
</Label>

Dies kann noch weiter vereinfacht werden, aber die Änderung führt eine neue Syntax ein: Sie besteht darin, die StaticExtension Klasse und die Membereinstellung in geschweifte Klammern zu setzen. Der resultierende Ausdruck wird direkt auf das FontSize -Attribut festgelegt:

<Label Text="Label No. 3"
       FontSize="{x:StaticExtension Member=local:AppConstants.NormalFontSize}" />

Beachten Sie, dass in den geschweiften Klammern keine Anführungszeichen vorhanden sind. Die Member -Eigenschaft von StaticExtension ist kein XML-Attribut mehr. Sie ist stattdessen Teil des Ausdrucks für die Markuperweiterung.

So wie Sie es x:Static abkürten x:StaticExtension können, wenn Sie es als Objektelement verwenden, können Sie es auch im Ausdruck in geschweiften Klammern abkürten:

<Label Text="Label No. 4"
       FontSize="{x:Static Member=local:AppConstants.NormalFontSize}" />

Die StaticExtension -Klasse verfügt über ein ContentProperty Attribut, das auf die -Eigenschaft Memberverweist, die diese Eigenschaft als standardinhaltseigenschaft der Klasse markiert. Bei XAML-Markuperweiterungen, die mit geschweiften Klammern ausgedrückt werden, können Sie den Member= Teil des Ausdrucks entfernen:

<Label Text="Label No. 5"
       FontSize="{x:Static local:AppConstants.NormalFontSize}" />

Dies ist die gebräuchlichste Form der x:Static Markuperweiterung.

Die Seite Statische Demo enthält zwei weitere Beispiele. Das Stammtag der XAML-Datei enthält eine XML-Namespacedeklaration für den .NET-Namespace System :

xmlns:sys="clr-namespace:System;assembly=netstandard"

Dadurch kann der Label Schriftgrad auf das statische Feld Math.PIfestgelegt werden. Dies führt zu eher kleinem Text, sodass die Scale -Eigenschaft auf Math.Efestgelegt ist:

<Label Text="&#x03C0; &#x00D7; E sized text"
       FontSize="{x:Static sys:Math.PI}"
       Scale="{x:Static sys:Math.E}"
       HorizontalOptions="Center" />

Im letzten Beispiel wird der Device.RuntimePlatform Wert angezeigt. Die Environment.NewLine statische Eigenschaft wird verwendet, um ein zeilenumbruchiges Zeichen zwischen den beiden Span Objekten einzufügen:

<Label HorizontalTextAlignment="Center"
       FontSize="{x:Static local:AppConstants.NormalFontSize}">
    <Label.FormattedText>
        <FormattedString>
            <Span Text="Runtime Platform: " />
            <Span Text="{x:Static sys:Environment.NewLine}" />
            <Span Text="{x:Static Device.RuntimePlatform}" />
        </FormattedString>
    </Label.FormattedText>
</Label>

Hier sehen Sie das Beispiel, das ausgeführt wird:

x:Static Demo

x:Reference-Markuperweiterung

Die x:Reference Markuperweiterung wird von der ReferenceExtension -Klasse unterstützt. Die -Klasse verfügt über eine einzelne Eigenschaft mit dem Namen Name vom Typ string , die Sie auf den Namen eines Elements auf der Seite festlegen, das einen Namen mit x:Nameerhalten hat. Diese Name Eigenschaft ist die Inhaltseigenschaft von ReferenceExtension, daher Name= ist nicht erforderlich, wenn x:Reference sie in geschweiften Klammern angezeigt wird.

Die x:Reference Markuperweiterung wird ausschließlich mit Datenbindungen verwendet, die im Artikel Datenbindung ausführlicher beschrieben werden.

Auf der Seite x:Reference Demo werden zwei Verwendungen von x:Reference mit Datenbindungen angezeigt: die erste, auf der die Source -Eigenschaft des Binding -Objekts festgelegt wird, und die zweite, auf der die BindingContext -Eigenschaft für zwei Datenbindungen festgelegt wird:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MarkupExtensions.ReferenceDemoPage"
             x:Name="page"
             Title="x:Reference Demo">

    <StackLayout Margin="10, 0">

        <Label Text="{Binding Source={x:Reference page},
                              StringFormat='The type of this page is {0}'}"
               FontSize="18"
               VerticalOptions="CenterAndExpand"
               HorizontalTextAlignment="Center" />

        <Slider x:Name="slider"
                Maximum="360"
                VerticalOptions="Center" />

        <Label BindingContext="{x:Reference slider}"
               Text="{Binding Value, StringFormat='{0:F0}&#x00B0; rotation'}"
               Rotation="{Binding Value}"
               FontSize="24"
               HorizontalOptions="Center"
               VerticalOptions="CenterAndExpand" />

    </StackLayout>
</ContentPage>

Beide x:Reference Ausdrücke verwenden die abgekürzte Version des ReferenceExtension Klassennamens und entfernen den Name= Teil des Ausdrucks. Im ersten Beispiel ist die x:Reference Markuperweiterung in die Binding Markuperweiterung eingebettet. Beachten Sie, dass die Source Einstellungen und StringFormat durch Kommas getrennt sind. Dies ist das Programm, das ausgeführt wird:

x:Reference Demo

x:Type-Markuperweiterung

Die x:Type Markuperweiterung ist die XAML-Entsprechung des C#- typeof Schlüsselwort (keyword). Sie wird von der TypeExtension -Klasse unterstützt, die eine Eigenschaft mit dem Namen TypeName des Typs string definiert, der auf einen Klassen- oder Strukturnamen festgelegt ist. Die x:Type Markuperweiterung gibt das System.Type Objekt dieser Klasse oder Struktur zurück. TypeName ist die Inhaltseigenschaft von TypeExtension, daher TypeName= ist nicht erforderlich, wenn x:Type mit geschweiften Klammern angezeigt wird.

In Xamarin.Formsgibt es mehrere Eigenschaften mit Argumenten vom Typ Type. Beispiele hierfür sind die TargetType -Eigenschaft von Styleund das x:TypeArguments-Attribut , das zum Angeben von Argumenten in generischen Klassen verwendet wird. Der XAML-Parser führt den typeof Vorgang jedoch automatisch aus, und die x:Type Markuperweiterung wird in diesen Fällen nicht verwendet.

Eine Stelle, an der x:Type erforderlich ist, ist die x:Array Markuperweiterung, die im nächsten Abschnitt beschrieben wird.

Die x:Type Markuperweiterung ist auch beim Erstellen eines Menüs nützlich, in dem jedes Menüelement einem Objekt eines bestimmten Typs entspricht. Sie können jedem Menüelement ein Type -Objekt zuordnen und das Objekt dann instanziieren, wenn das Menüelement ausgewählt ist.

So funktioniert das Navigationsmenü im MainPageMarkuperweiterungsprogramm . Die Datei MainPage.xaml enthält eine TableView mit jeweils TextCell einer bestimmten Seite im Programm:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:MarkupExtensions"
             x:Class="MarkupExtensions.MainPage"
             Title="Markup Extensions"
             Padding="10">
    <TableView Intent="Menu">
        <TableRoot>
            <TableSection>
                <TextCell Text="x:Static Demo"
                          Detail="Access constants or statics"
                          Command="{Binding NavigateCommand}"
                          CommandParameter="{x:Type local:StaticDemoPage}" />

                <TextCell Text="x:Reference Demo"
                          Detail="Reference named elements on the page"
                          Command="{Binding NavigateCommand}"
                          CommandParameter="{x:Type local:ReferenceDemoPage}" />

                <TextCell Text="x:Type Demo"
                          Detail="Associate a Button with a Type"
                          Command="{Binding NavigateCommand}"
                          CommandParameter="{x:Type local:TypeDemoPage}" />

                <TextCell Text="x:Array Demo"
                          Detail="Use an array to fill a ListView"
                          Command="{Binding NavigateCommand}"
                          CommandParameter="{x:Type local:ArrayDemoPage}" />

                ···                          

        </TableRoot>
    </TableView>
</ContentPage>

Dies ist die Öffnen Standard Seite in Markuperweiterungen:

Hauptseite

Jede CommandParameter Eigenschaft wird auf eine x:Type Markuperweiterung festgelegt, die auf eine der anderen Seiten verweist. Die Command -Eigenschaft ist an eine Eigenschaft namens NavigateCommandgebunden. Diese Eigenschaft ist in der MainPage CodeBehind-Datei definiert:

public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();

        NavigateCommand = new Command<Type>(async (Type pageType) =>
        {
            Page page = (Page)Activator.CreateInstance(pageType);
            await Navigation.PushAsync(page);
        });

        BindingContext = this;
    }

    public ICommand NavigateCommand { private set; get; }
}

Die NavigateCommand -Eigenschaft ist ein Command -Objekt, das einen execute-Befehl mit einem Argument vom Typ Type implementiert – dem Wert von CommandParameter. Die -Methode verwendet Activator.CreateInstance , um die Seite zu instanziieren und dann zu ihr zu navigieren. Der Konstruktor schließt, indem er die BindingContext der Seite auf sich selbst festlegt, wodurch der Binding auf Command funktioniert. Weitere Informationen zu diesem Codetyp finden Sie im Artikel Datenbindung und insbesondere im Artikel Befehle .

Die x:Type Demo-Seite verwendet eine ähnliche Technik zum Instanziieren Xamarin.Forms von Elementen und zum Hinzufügen sie zu einem StackLayout. Die XAML-Datei besteht zunächst aus drei Button Elementen, deren Command Eigenschaften auf ein Binding festgelegt sind und die CommandParameter Eigenschaften auf Typen von drei Xamarin.Forms Ansichten festgelegt sind:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MarkupExtensions.TypeDemoPage"
             Title="x:Type Demo">

    <StackLayout x:Name="stackLayout"
                 Padding="10, 0">

        <Button Text="Create a Slider"
                HorizontalOptions="Center"
                VerticalOptions="CenterAndExpand"
                Command="{Binding CreateCommand}"
                CommandParameter="{x:Type Slider}" />

        <Button Text="Create a Stepper"
                HorizontalOptions="Center"
                VerticalOptions="CenterAndExpand"
                Command="{Binding CreateCommand}"
                CommandParameter="{x:Type Stepper}" />

        <Button Text="Create a Switch"
                HorizontalOptions="Center"
                VerticalOptions="CenterAndExpand"
                Command="{Binding CreateCommand}"
                CommandParameter="{x:Type Switch}" />
    </StackLayout>
</ContentPage>

Die CodeBehind-Datei definiert und initialisiert die CreateCommand Eigenschaft:

public partial class TypeDemoPage : ContentPage
{
    public TypeDemoPage()
    {
        InitializeComponent();

        CreateCommand = new Command<Type>((Type viewType) =>
        {
            View view = (View)Activator.CreateInstance(viewType);
            view.VerticalOptions = LayoutOptions.CenterAndExpand;
            stackLayout.Children.Add(view);
        });

        BindingContext = this;
    }

    public ICommand CreateCommand { private set; get; }
}

Die Methode, die ausgeführt wird, wenn ein Button gedrückt wird, erstellt eine neue instance des Arguments, legt seine VerticalOptions -Eigenschaft fest und fügt sie dem StackLayouthinzu. Die drei Button Elemente teilen dann die Seite mit dynamisch erstellten Ansichten:

x:Type Demo

x:Array-Markuperweiterung

Mit x:Array der Markuperweiterung können Sie ein Array im Markup definieren. Sie wird von der ArrayExtension -Klasse unterstützt, die zwei Eigenschaften definiert:

  • Type vom Typ Type, der den Typ der Elemente im Array angibt.
  • Items vom Typ IList, der eine Auflistung der Elemente selbst ist. Dies ist die Inhaltseigenschaft von ArrayExtension.

Die x:Array Markuperweiterung selbst wird nie in geschweiften Klammern angezeigt. x:Array Stattdessen trennen Start- und Endtags die Liste der Elemente. Legen Sie die Type -Eigenschaft auf eine x:Type Markuperweiterung fest.

Auf der Seite x:Array-Demo wird gezeigt, wie Sie verwenden x:Array , um Elemente zu einem ListView hinzuzufügen, indem Sie die ItemsSource -Eigenschaft auf ein Array festlegen:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MarkupExtensions.ArrayDemoPage"
             Title="x:Array Demo Page">
    <ListView Margin="10">
        <ListView.ItemsSource>
            <x:Array Type="{x:Type Color}">
                <Color>Aqua</Color>
                <Color>Black</Color>
                <Color>Blue</Color>
                <Color>Fuchsia</Color>
                <Color>Gray</Color>
                <Color>Green</Color>
                <Color>Lime</Color>
                <Color>Maroon</Color>
                <Color>Navy</Color>
                <Color>Olive</Color>
                <Color>Pink</Color>
                <Color>Purple</Color>
                <Color>Red</Color>
                <Color>Silver</Color>
                <Color>Teal</Color>
                <Color>White</Color>
                <Color>Yellow</Color>
            </x:Array>
        </ListView.ItemsSource>

        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <BoxView Color="{Binding}"
                             Margin="3" />    
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</ContentPage>        

Der ViewCell erstellt eine einfache BoxView für jeden Farbeintrag:

x:Array Demo

Es gibt mehrere Möglichkeiten, die einzelnen Color Elemente in diesem Array anzugeben. Sie können eine x:Static Markuperweiterung verwenden:

<x:Static Member="Color.Blue" />

Alternativ können StaticResource Sie eine Farbe aus einem Ressourcenwörterbuch abrufen:

<StaticResource Key="myColor" />

Am Ende dieses Artikels wird eine benutzerdefinierte XAML-Markuperweiterung angezeigt, die auch einen neuen Farbwert erstellt:

<local:HslColor H="0.5" S="1.0" L="0.5" />

Wenn Sie Arrays allgemeiner Typen wie Zeichenfolgen oder Zahlen definieren, verwenden Sie die Im Artikel Übergebende Konstruktorargumente aufgeführten Tags, um die Werte zu trennen.

x:Null-Markuperweiterung

Die x:Null Markuperweiterung wird von der NullExtension -Klasse unterstützt. Es verfügt über keine Eigenschaften und ist einfach das XAML-Äquivalent des C#- null Schlüsselwort (keyword).

Die x:Null Markuperweiterung wird selten benötigt und selten verwendet, aber wenn Sie einen Bedarf dafür finden, werden Sie froh sein, dass sie vorhanden ist.

Die x:Null-Demoseite veranschaulicht ein Szenario, in dem x:Null dies sinnvoll sein könnte. Angenommen, Sie definieren ein implizites Style für Label , das ein Setter enthält, das die FontFamily Eigenschaft auf einen plattformabhängigen Familiennamen festlegt:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MarkupExtensions.NullDemoPage"
             Title="x:Null Demo">
    <ContentPage.Resources>
        <ResourceDictionary>
            <Style TargetType="Label">
                <Setter Property="FontSize" Value="48" />
                <Setter Property="FontFamily">
                    <Setter.Value>
                        <OnPlatform x:TypeArguments="x:String">
                            <On Platform="iOS" Value="Times New Roman" />
                            <On Platform="Android" Value="serif" />
                            <On Platform="UWP" Value="Times New Roman" />
                        </OnPlatform>
                    </Setter.Value>
                </Setter>
            </Style>
        </ResourceDictionary>
    </ContentPage.Resources>

    <ContentPage.Content>
        <StackLayout Padding="10, 0">
            <Label Text="Text 1" />
            <Label Text="Text 2" />

            <Label Text="Text 3"
                   FontFamily="{x:Null}" />

            <Label Text="Text 4" />
            <Label Text="Text 5" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>   

Dann stellen Sie fest, dass Sie für eines der Label Elemente alle Eigenschafteneinstellungen im impliziten Style mit Ausnahme von FontFamilymöchten, das der Standardwert sein soll. Sie könnten zu diesem Zweck eine andere Style definieren, aber ein einfacherer Ansatz besteht darin, einfach die FontFamily Eigenschaft des bestimmten Label auf festzulegen x:Null, wie in der Mitte Labelveranschaulicht.

Dies ist das Programm, das ausgeführt wird:

x:Null Demo

Beachten Sie, dass vier der Label Elemente über eine serifenfreie Schriftart verfügen, die Mitte Label jedoch über die standardmäßige serifenlose Schriftart verfügt.

OnPlatform-Markuperweiterung

Die Markuperweiterung OnPlatform ermöglicht Ihnen das plattformspezifische Anpassen der Benutzeroberfläche. Es bietet die gleiche Funktionalität wie die OnPlatform Klassen und On , aber mit einer präziseren Darstellung.

Die Markuperweiterung OnPlatform wird von der Klasse OnPlatformExtension unterstützt, in der die folgenden Eigenschaften definiert werden:

  • Default vom Typ object, den Sie auf einen Standardwert festlegen, der auf die Eigenschaften angewendet werden soll, die Plattformen darstellen.
  • Android vom Typ object, den Sie auf einen Wert festlegen, der auf Android angewendet werden soll.
  • GTK vom Typ object, den Sie auf einen Wert festlegen, der auf GTK-Plattformen angewendet werden soll.
  • iOS vom Typ object, den Sie auf einen Wert festlegen, der auf iOS angewendet werden soll.
  • macOS vom Typ object, den Sie auf einen Wert festlegen, der auf macOS angewendet werden soll.
  • Tizen vom Typ object, den Sie auf einen Wert festlegen, der auf die Tizen-Plattform angewendet werden soll.
  • UWPvom Typ object, den Sie auf einen Wert festlegen, der auf den Universelle Windows-Plattform angewendet werden soll.
  • WPFvom Typ object, den Sie auf einen Wert festlegen, der auf die Windows Presentation Foundation-Plattform angewendet werden soll.
  • Converter vom Typ IValueConverter, der auf eine IValueConverter Implementierung festgelegt werden kann.
  • ConverterParameter vom Typ object, der auf einen Wert festgelegt werden kann, der an die IValueConverter Implementierung übergeben werden soll.

Hinweis

Im XAML-Parser kann die Klasse OnPlatformExtension zu OnPlatform abgekürzt werden.

Die Default -Eigenschaft ist die Inhaltseigenschaft von OnPlatformExtension. Daher können Sie bei XAML-Markupausdrücken, die mit geschweiften Klammern ausgedrückt werden, den Default= Teil des Ausdrucks entfernen, vorausgesetzt, es handelt sich um das erste Argument. Wenn die Default Eigenschaft nicht festgelegt ist, wird standardmäßig der BindableProperty.DefaultValue Eigenschaftswert verwendet, vorausgesetzt, die Markuperweiterung zielt auf einen ab BindableProperty.

Wichtig

Der XAML-Parser erwartet, dass Werte des richtigen Typs für Eigenschaften bereitgestellt werden, die die OnPlatform Markuperweiterung verwenden. Wenn die Typkonvertierung erforderlich ist, versucht die OnPlatform Markuperweiterung, diese mithilfe der von Xamarin.Formsbereitgestellten Standardkonverter auszuführen. Es gibt jedoch einige Typkonvertierungen, die von den Standardkonvertern nicht ausgeführt werden können, und in diesen Fällen sollte die Converter Eigenschaft auf eine IValueConverter Implementierung festgelegt werden.

Auf der Seite OnPlatform-Demo wird gezeigt, wie Die OnPlatform Markuperweiterung verwendet wird:

<BoxView Color="{OnPlatform Yellow, iOS=Red, Android=Green, UWP=Blue}"
         WidthRequest="{OnPlatform 250, iOS=200, Android=300, UWP=400}"  
         HeightRequest="{OnPlatform 250, iOS=200, Android=300, UWP=400}"
         HorizontalOptions="Center" />

In diesem Beispiel verwenden alle drei OnPlatform Ausdrücke die abgekürzte Version des OnPlatformExtension Klassennamens. Die drei OnPlatform Markuperweiterungen legen die ColorEigenschaften , WidthRequestund HeightRequest auf BoxView unterschiedliche Werte unter iOS, Android und UWP fest. Die Markuperweiterungen bieten auch Standardwerte für diese Eigenschaften auf den Plattformen, die nicht angegeben werden, während der Default= Teil des Ausdrucks beseitigt wird. Beachten Sie, dass die festgelegten Markuperweiterungseigenschaften durch Kommas getrennt sind.

Dies ist das Programm, das ausgeführt wird:

OnPlatform Demo

OnIdiom-Markuperweiterung

Mit der OnIdiom Markuperweiterung können Sie die Darstellung der Benutzeroberfläche basierend auf der Sprache des Geräts anpassen, auf dem die Anwendung ausgeführt wird. Es wird von der OnIdiomExtension -Klasse unterstützt, die die folgenden Eigenschaften definiert:

  • Default vom Typ object, den Sie auf einen Standardwert festlegen, der auf die Eigenschaften angewendet werden soll, die Geräteidiome darstellen.
  • Phone vom Typ object, den Sie auf einen Wert festlegen, der auf Smartphones angewendet werden soll.
  • Tablet vom Typ object, den Sie auf einen Wert festlegen, der auf Tablets angewendet werden soll.
  • Desktop vom Typ object, den Sie auf einen Wert festlegen, der auf Desktopplattformen angewendet werden soll.
  • TV vom Typ object, den Sie auf einen Wert festlegen, der auf TV-Plattformen angewendet werden soll.
  • Watch vom Typ object, den Sie auf einen Wert festlegen, der auf Watch-Plattformen angewendet werden soll.
  • Converter vom Typ IValueConverter, der auf eine IValueConverter Implementierung festgelegt werden kann.
  • ConverterParameter vom Typ object, der auf einen Wert festgelegt werden kann, der an die IValueConverter Implementierung übergeben werden soll.

Hinweis

Im XAML-Parser kann die Klasse OnIdiomExtension zu OnIdiom abgekürzt werden.

Die Default -Eigenschaft ist die Inhaltseigenschaft von OnIdiomExtension. Daher können Sie bei XAML-Markupausdrücken, die mit geschweiften Klammern ausgedrückt werden, den Default= Teil des Ausdrucks entfernen, vorausgesetzt, es handelt sich um das erste Argument.

Wichtig

Der XAML-Parser erwartet, dass Werte des richtigen Typs für Eigenschaften bereitgestellt werden, die die OnIdiom Markuperweiterung verwenden. Wenn die Typkonvertierung erforderlich ist, versucht die OnIdiom Markuperweiterung, diese mithilfe der von Xamarin.Formsbereitgestellten Standardkonverter auszuführen. Es gibt jedoch einige Typkonvertierungen, die von den Standardkonvertern nicht ausgeführt werden können, und in diesen Fällen sollte die Converter Eigenschaft auf eine IValueConverter Implementierung festgelegt werden.

Auf der Seite OnIdiom-Demo wird gezeigt, wie die OnIdiom Markuperweiterung verwendet wird:

<BoxView Color="{OnIdiom Yellow, Phone=Red, Tablet=Green, Desktop=Blue}"
         WidthRequest="{OnIdiom 100, Phone=200, Tablet=300, Desktop=400}"
         HeightRequest="{OnIdiom 100, Phone=200, Tablet=300, Desktop=400}"
         HorizontalOptions="Center" />

In diesem Beispiel verwenden alle drei OnIdiom Ausdrücke die abgekürzte Version des OnIdiomExtension Klassennamens. Die drei OnIdiom Markuperweiterungen legen die ColorEigenschaften , WidthRequestund HeightRequest auf BoxView verschiedene Werte auf dem Smartphone, Tablet und Desktop-Idiomen fest. Die Markuperweiterungen stellen auch Standardwerte für diese Eigenschaften für die nicht angegebenen Redewendungen bereit, während der Default= Teil des Ausdrucks entfernt wird. Beachten Sie, dass die festgelegten Markuperweiterungseigenschaften durch Kommas getrennt sind.

Dies ist das Programm, das ausgeführt wird:

OnIdiom Demo

DataTemplate-Markuperweiterung

Mit der DataTemplate Markuperweiterung können Sie einen Typ in einen DataTemplatekonvertieren. Es wird von der DataTemplateExtension -Klasse unterstützt, die eine TypeName Eigenschaft vom Typ stringdefiniert, die auf den Namen des Typs festgelegt ist, der in einen DataTemplatekonvertiert werden soll. Die TypeName -Eigenschaft ist die Inhaltseigenschaft von DataTemplateExtension. Daher können Sie bei XAML-Markupausdrücken (die mit geschweiften Klammern ausgedrückt werden) den TypeName=-Teil des Ausdrucks entfernen.

Hinweis

Im XAML-Parser kann die Klasse DataTemplateExtension zu DataTemplate abgekürzt werden.

Eine typische Verwendung dieser Markuperweiterung erfolgt in einer Shellanwendung, wie im folgenden Beispiel gezeigt:

<ShellContent Title="Monkeys"
              Icon="monkey.png"
              ContentTemplate="{DataTemplate views:MonkeysPage}" />

In diesem Beispiel wird von einem ContentPage in ein DataTemplatekonvertiert, MonkeysPage das als Wert der ShellContent.ContentTemplate -Eigenschaft festgelegt wird. Dadurch wird sichergestellt, dass MonkeysPage nur erstellt wird, wenn die Navigation zur Seite statt beim Start der Anwendung erfolgt.

Weitere Informationen zu Shellanwendungen finden Sie unter Xamarin.Forms-Shell.

FontImage-Markuperweiterung

Mit der FontImage Markuperweiterung können Sie ein Schriftartsymbol in jeder Ansicht anzeigen, die einen ImageSourceanzeigen kann. Es bietet die gleiche Funktionalität wie die FontImageSource -Klasse, aber mit einer präziseren Darstellung.

Die Markuperweiterung FontImage wird von der Klasse FontImageExtension unterstützt, in der die folgenden Eigenschaften definiert werden:

  • FontFamily vom Typ string, die Schriftfamilie, zu der das Schriftsymbol gehört.
  • Glyph vom Typ string, der Unicode-Zeichenwert des Schriftartsymbols.
  • Color vom Typ Color, die Farbe, die beim Anzeigen des Schriftartsymbols verwendet werden soll.
  • Size vom Typ double, die Größe des gerenderten Schriftartsymbols in geräteunabhängigen Einheiten. Der Standardwert ist 30. Darüber hinaus kann diese Eigenschaft auf einen benannten Schriftgrad festgelegt werden.

Hinweis

Im XAML-Parser kann die Klasse FontImageExtension zu FontImage abgekürzt werden.

Die Glyph -Eigenschaft ist die Inhaltseigenschaft von FontImageExtension. Daher können Sie bei XAML-Markupausdrücken, die mit geschweiften Klammern ausgedrückt werden, den Glyph= Teil des Ausdrucks entfernen, vorausgesetzt, es handelt sich um das erste Argument.

Auf der Seite FontImage-Demo wird die Verwendung der FontImage Markuperweiterung veranschaulicht:

<Image BackgroundColor="#D1D1D1"
       Source="{FontImage &#xf30c;, FontFamily={OnPlatform iOS=Ionicons, Android=ionicons.ttf#}, Size=44}" />

In diesem Beispiel wird die abgekürzte Version des FontImageExtension Klassennamens verwendet, um ein XBox-Symbol aus der Ionicons-Schriftfamilie in einem Imageanzuzeigen. Der Ausdruck verwendet auch die OnPlatform Markuperweiterung, um unterschiedliche FontFamily Eigenschaftswerte unter iOS und Android anzugeben. Außerdem wird der Glyph= Teil des Ausdrucks entfernt, und die festgelegten Markuperweiterungseigenschaften werden durch Kommas getrennt. Beachten Sie, dass das Unicode-Zeichen für das Symbol zwar ist \uf30c, es jedoch in XAML mit Escapezeichen versehen werden muss und somit zu wird &#xf30c;.

Dies ist das Programm, das ausgeführt wird:

Screenshot der FontImage-Markuperweiterung

Informationen zum Anzeigen von Schriftartsymbolen durch Angeben der Schriftsymboldaten in einem FontImageSource Objekt finden Sie unter Anzeigen von Schriftartsymbolen.

Markuperweiterung AppThemeBinding

Mit AppThemeBinding der Markuperweiterung können Sie basierend auf dem aktuellen Systemdesign eine zu verwendende Ressource angeben, z. B. ein Bild oder eine Farbe.

Wichtig

Für die AppThemeBinding Markuperweiterung gelten Mindestanforderungen für das Betriebssystem. Weitere Informationen finden Sie unter Reagieren auf Systemdesignänderungen in Xamarin.Forms Anwendungen.

Die Markuperweiterung AppThemeBinding wird von der Klasse AppThemeBindingExtension unterstützt, in der die folgenden Eigenschaften definiert werden:

  • Defaultvom Typ object, das Sie auf die standardmäßig zu verwendende Ressource festlegen.
  • Lightvom Typ object, das Sie auf die Ressource festlegen, die verwendet werden soll, wenn das Gerät sein helles Design verwendet.
  • Darkvom Typ object, das Sie auf die Ressource festlegen, die verwendet werden soll, wenn das Gerät sein dunkles Design verwendet.
  • Valuevom Typ object, das die Ressource zurückgibt, die derzeit von der Markuperweiterung verwendet wird.

Hinweis

Im XAML-Parser kann die Klasse AppThemeBindingExtension zu AppBindingTheme abgekürzt werden.

Die Default -Eigenschaft ist die Inhaltseigenschaft von AppThemeBindingExtension. Daher können Sie bei XAML-Markupausdrücken, die mit geschweiften Klammern ausgedrückt werden, den Default= Teil des Ausdrucks entfernen, sofern es sich um das erste Argument handelt.

Auf der Seite AppThemeBinding Demo wird die Verwendung der AppThemeBinding Markuperweiterung veranschaulicht:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MarkupExtensions.AppThemeBindingDemoPage"
             Title="AppThemeBinding Demo">
    <ContentPage.Resources>

        <Style x:Key="labelStyle"
               TargetType="Label">
            <Setter Property="TextColor"
                    Value="{AppThemeBinding Black, Light=Blue, Dark=Teal}" />
        </Style>

    </ContentPage.Resources>
    <StackLayout Margin="20">
        <Label Text="This text is green in light mode, and red in dark mode."
               TextColor="{AppThemeBinding Light=Green, Dark=Red}" />
        <Label Text="This text is black by default, blue in light mode, and teal in dark mode."
               Style="{StaticResource labelStyle}" />
    </StackLayout>
</ContentPage>

In diesem Beispiel wird die Textfarbe der ersten Label auf Grün festgelegt, wenn das Gerät sein helles Design verwendet, und wird auf Rot festgelegt, wenn das Gerät sein dunkles Design verwendet. Die zweite Label verfügt über eine Stylefestgelegte TextColor -Eigenschaft. Dadurch Style wird die Textfarbe von Label standardmäßig auf schwarz, auf Blau festgelegt, wenn das Gerät sein helles Design verwendet, und auf Teal, wenn das Gerät sein dunkles Design verwendet.

Dies ist das Programm, das ausgeführt wird:

AppThemeBinding Demo

Definieren von Markuperweiterungen

Wenn Sie eine XAML-Markuperweiterung benötigen, die in Xamarin.Formsnicht verfügbar ist, können Sie eine eigene erstellen.