Freigeben über

XAML-Markuperweiterungen konsumieren

  • Artikel

Browse sample. Die Stichprobe durchsuchen

XAML-Markuperweiterungen für .NET Multi-Platform App UI (.NET MAUI) verbessern die Leistungsfähigkeit und Flexibilität von XAML, indem Elementattribute aus einer Vielzahl von Quellen festgelegt werden können.

Beispielsweise legen Sie die Color-Eigenschaft von BoxView wie folgt fest:

<BoxView Color="Blue" />

Sie könnenauch ein Color-Attribut von einem in einem Ressourcenwörterbuch gespeicherten Wert oder dem Wert einer statischen Eigenschaft einer von Ihnen erstellten Klasse oder aus einer Eigenschaft vom Typ Color eines anderen Elements auf der Seite festlegen oder aus separaten Farbton-, Sättigungs- und Leuchtdichtewerten erstellen. Alle diese Optionen sind mithilfe von XAML-Markuperweiterungen möglich.

Eine Markuperweiterung ist eine andere Möglichkeit, ein Attribut eines Elements auszudrücken. .NET MAUI XAML-Markuperweiterungen sind in der Regel durch einen Attributwert identifizierbar, der in geschweifte Klammern eingeschlossen ist:

<BoxView Color="{StaticResource themeColor}" />

Jeder Attributwert in geschweiften Klammern ist immer eine XAML-Markuperweiterung. XAML-Markuperweiterungen können jedoch auch ohne die Verwendung von geschweiften Klammern referenziert werden.

Hinweis

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.

Zusätzlich zu den in diesem Artikel erläuterten Markuperweiterungen sind die folgenden Markuperweiterungen in .NET MAUI enthalten und in anderen Artikeln erläutert:

x:Statische Markuperweiterung

Die x:Static-Markuperweiterung wird von der StaticExtension-Klasse unterstützt. Die Klasse verfügt über eine einzelne Eigenschaft mit dem Namen Member des Typs string, die Sie auf den Namen einer öffentlichen Konstante, einer statischen Eigenschaft, eines statischen Felds oder eines Enumerationselements festlegen.

Eine Möglichkeit zur Verwendung von x:Static besteht darin, zuerst eine Klasse mit einigen Konstanten oder statischen Variablen zu definieren, z. B. diese AppConstants-Klasse:

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

Der folgende XAML-Code veranschaulicht den ausführlichsten Ansatz zum Instanziieren der StaticExtension-Klasse zwischen Label.FontSize-Eigenschaftselementtags:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             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>

Im XAML-Parser kann die Klasse StaticExtension auch zu x:Static abgekürzt werden.

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

Diese Syntax kann noch weiter vereinfacht werden, indem die StaticExtension-Klasse und die Mitgliedereinstellung in geschweifte Klammern eingefügt werden. Der resultierende Ausdruck wird direkt auf das FontSize-Attribut festgelegt:

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

In diesem Beispiel gibt es keine Anführungszeichen innerhalb der geschweiften Klammern. Die Member-Eigenschaft von StaticExtension ist kein XML-Attribut mehr. Sie ist stattdessen Teil des Ausdrucks für die Markuperweiterung.

Genauso wie Sie x:StaticExtension bei Verwendung als Objektelement zu x:Static abkürzen können, können Sie auch im Ausdruck innerhalb geschweifter Klammern abkürzen:

<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 Member verweist, die diese Eigenschaft als Standardinhaltseigenschaft der Klasse kennzeichnet. 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 häufigste Form der x:Static-Markuperweiterung.

Das Stammtag des XAML-Beispiels enthält auch eine XML-Namespacedeklaration für den .NET-Namespace System . Dadurch kann der Label-Schriftgrad auf das statische Feld Math.PI festgelegt werden. Dies führt zu eher kleinem Text, sodass die Scale-Eigenschaft auf Math.E festgelegt wird:

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

Im folgenden Screenshot ist die XAML-Ausgabe dargestellt:

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 des Typs string, die Sie auf den Namen eines Elements auf der Seite festlegen, dem ein Name mit x:Name zugewiesen wurde. Diese Name-Eigenschaft ist die Inhaltseigenschaft von ReferenceExtension, daher ist Name= nicht erforderlich, wenn x:Reference in geschweiften Klammern angezeigt wird. Die x:Reference-Markuperweiterung wird ausschließlich mit Datenbindungen verwendet. Weitere Informationen zur Datenbindung finden Sie unter Datenbindung.

Das folgende XAML-Beispiel zeigt zwei Verwendungen von x:Reference mit Datenbindungen, der erste, an der sie zum Festlegen der Source-Eigenschaft des Binding-Objekts verwendet wird, und die zweite, in der sie zum Festlegen der BindingContext-Eigenschaft für zwei Datenbindungen verwendet wird:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             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="Center"
               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="Center" />        
    </StackLayout>
</ContentPage>

In diesem Beispiel verwenden beide x:Reference-Ausdrücke die abgekürzte Version des ReferenceExtension-Klassennamens und entfernen den Name=-Teil des Ausdrucks. Im ersten Beispiel wird die x:Reference-Markuperweiterung in die Binding-Markuperweiterung eingebettet, und die Eigenschaften Source und StringFormat werden durch Kommas getrennt.

Im folgenden Screenshot ist die XAML-Ausgabe dargestellt:

x:Reference demo.

x:Type-Markuperweiterung

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

Die x:Type-Markuperweiterung wird häufig mit der x:Array-Markuperweiterung verwendet. Weitere Informationen finden Sie unter x:Array-Markuperweiterung.

Das folgende XAML-Beispiel veranschaulicht die Verwendung der x:Type-Markuperweiterung zum Instanziieren von .NET MAUI-Objekten und zum Hinzufügen zu einem StackLayout. Der XAML-Code besteht aus drei Button-Elementen, deren Command-Eigenschaften auf eine Binding und die CommandParameter-Eigenschaften auf Typen von drei .NET MAUI-Ansichten festgelegt sind:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             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="Center"
                Command="{Binding CreateCommand}"
                CommandParameter="{x:Type Slider}" />
        <Button Text="Create a Stepper"
                HorizontalOptions="Center"
                VerticalOptions="Center"
                Command="{Binding CreateCommand}"
                CommandParameter="{x:Type Stepper}" />
        <Button Text="Create a Switch"
                HorizontalOptions="Center"
                VerticalOptions="Center"
                Command="{Binding CreateCommand}"
                CommandParameter="{x:Type Switch}" />
    </StackLayout>
</ContentPage>

Die CodeBehind-Datei definiert und initialisiert die CreateCommand-Eigenschaft:

public partial class TypeDemoPage : ContentPage
{
    public ICommand CreateCommand { get; private set; }

    public TypeDemoPage()
    {
        InitializeComponent();

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

        BindingContext = this;
    }
}

Beim Aufsetzen einer Button wird eine neue Instanz des Arguments CommandParameter erstellt und zu StackLayout hinzugefügt. Die drei Button-Objekte teilen dann die Seite mit dynamisch erstellten Ansichten:

x:Type demo.

x:Array-Markuperweiterung

Mit der x:Array-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. Diese Eigenschaft sollte auf eine x:Type-Markuperweiterung festgelegt werden.
  • Items vom Typ IList, bei dem es sich um eine Sammlung der Elemente selbst handelt. Dies ist die Inhaltseigenschaft von ArrayExtension.

Die x:Array-Markuperweiterung selbst wird nie in geschweiften Klammern angezeigt. Stattdessen heben x:Array-Start- und Endtags die Begrenzung der Liste der Elemente auf.

Im folgenden XAML-Beispiel wird gezeigt, wie man x:Array verwendet, um Elemente zu ListView hinzufügen, indem Sie die ItemsSource-Eigenschaft auf ein Array festlegen:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             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>

In diesem Beispiel erzeugt ViewCell einen simplen BoxView für jeden Farbeintrag:

x:Array demo.

Hinweis

Verwenden Sie beim Definieren von Arrays gängiger Typen wie Zeichenfolgen oder Zahlen die in Pass-Argumenten aufgeführten XAML-Sprachgrundtypen.

x:Null-Markuperweiterung

Die x:Null-Markuperweiterung wird von der NullExtension-Klasse unterstützt. Es hat keine Eigenschaften und ist einfach die XAML-Entsprechung des C# null-Schlüsselwortes.

Im folgenden XAML-Beispiel wird die Verwendung der x:Null-Markuperweiterung gezeigt:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MarkupExtensions.NullDemoPage"
             Title="x:Null Demo">
    <ContentPage.Resources>
        <Style TargetType="Label">
            <Setter Property="FontSize" Value="48" />
            <Setter Property="FontFamily" Value="OpenSansRegular" />
        </Style>
    </ContentPage.Resources>

    <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>

In diesem Beispiel wird ein impliziter Style für Label festgelegt, der einen Setter beinhaltet, der die Eigenschaft FontFamily auf einen bestimmten Schrifttyp festlegt. Der dritte Label vehidnert jedoch die Verwendung der Schriftart, die im impliziten Stil definiert ist, indem FontFamily auf x:Null gesetzt wird:

x:Null demo.

Datenvorlage-Markuperweiterung

Mit der DataTemplate-Markuperweiterung können Sie einen Typ in einen DataTemplate umwandeln. Es wird von der DataTemplateExtension.Klasse unterstützt, die eine TypeName.Eigenschaft vom Typ string definiert, die auf den Namen des Typs festgelegt ist, der in eine DataTemplate konvertiert werden soll. Die TypeName-Eigenschaft stellt die Inhaltseigenschaft der Klasse DataTemplateExtension dar. 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 Shell-Anwendung, wie im folgenden Beispiel gezeigt:

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

In diesem Beispiel wird MonkeysPage von einer ContentPage in eine DataTemplate, die als Wert der ShellContent.ContentTemplate-Eigenschaft eingestellt ist, konvertiert. Dadurch wird sichergestellt, dass MonkeysPage statt beim Start der Anwendung nur erstellt wird, wenn die Navigation zur Seite erfolgt.

Weitere Informationen zu Shell-Apps finden Sie unter Shell.