Korzystanie z rozszerzeń znaczników XAML

Przeglądanie przykładu

Rozszerzenia znaczników XAML (.NET MAUI) wieloplatformowych interfejsów użytkownika aplikacji platformy .NET pomagają zwiększyć moc i elastyczność języka XAML, umożliwiając ustawianie atrybutów elementów z różnych źródeł.

Na przykład zazwyczaj ustawiasz właściwość podobną Color do następującej BoxView :

<BoxView Color="Blue" />

Jednak zamiast tego można ustawić Color atrybut z wartości przechowywanej w słowniku zasobów lub z wartości statycznej klasy, która została utworzona, lub na podstawie właściwości typu Color innego elementu na stronie lub skonstruowanej z oddzielnych wartości odcieni, nasycenia i jasności. Wszystkie te opcje są możliwe przy użyciu rozszerzeń znaczników XAML.

Rozszerzenie znaczników to inny sposób wyrażania atrybutu elementu. Rozszerzenia znaczników XAML platformy .NET MAUI są zwykle możliwe do zidentyfikowania przez wartość atrybutu, która jest ujęta w nawiasy klamrowe:

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

Każda wartość atrybutu w nawiasach klamrowych jest zawsze rozszerzeniem znaczników XAML. Można jednak odwoływać się do rozszerzeń znaczników XAML bez użycia nawiasów klamrowych.

Uwaga

Kilka rozszerzeń znaczników XAML jest częścią specyfikacji XAML 2009. Są one wyświetlane w plikach XAML z niestandardowym x prefiksem przestrzeni nazw i są często określane z tym prefiksem.

Oprócz rozszerzeń znaczników omówionych w tym artykule następujące rozszerzenia znaczników są zawarte w programie .NET MAUI i omówione w innych artykułach:

• AppThemeBinding — określa zasób, który ma być używany na podstawie bieżącego motywu systemu. Aby uzyskać więcej informacji, zobacz AppThemeBinding markup extension (Rozszerzenie znaczników AppThemeBinding).
• Binding - ustanawia łącze między właściwościami dwóch obiektów. Aby uzyskać więcej informacji, zobacz Powiązanie danych.
• DynamicResource — reaguje na zmiany w obiektach w słowniku zasobów. Aby uzyskać więcej informacji, zobacz Style dynamiczne.
• FontImage — wyświetla ikonę czcionki w dowolnym widoku, który może wyświetlać element ImageSource. Aby uzyskać więcej informacji, zobacz Ładowanie ikony czcionki.
• OnIdiom — dostosowuje wygląd interfejsu użytkownika na podstawie idiomu urządzenia, na którym działa aplikacja. Aby uzyskać więcej informacji, zobacz Dostosowywanie wyglądu interfejsu użytkownika na podstawie idiomu urządzenia.
• OnPlatform — dostosowuje wygląd interfejsu użytkownika dla poszczególnych platform. Aby uzyskać więcej informacji, zobacz Dostosowywanie wyglądu interfejsu użytkownika na podstawie platformy.
• RelativeSource — ustawia źródło powiązania względem położenia elementu docelowego powiązania. Aby uzyskać więcej informacji, zobacz Powiązania względne.
• StaticResource — odwołuje się do obiektów ze słownika zasobów. Aby uzyskać więcej informacji, zobacz Słowniki zasobów.
• TemplateBinding — wykonuje powiązanie danych z szablonu kontrolki. Aby uzyskać więcej informacji, zobacz Szablony kontrolek.

x:Statyczne rozszerzenie znaczników

Rozszerzenie x:Static znaczników jest obsługiwane przez klasę StaticExtension . Klasa ma pojedynczą właściwość o nazwie Member typu string , która została ustawiona na nazwę stałego publicznego, właściwości statycznej, pola statycznego lub składowej wyliczenia.

Jednym ze sposobów użycia x:Static jest najpierw zdefiniowanie klasy z niektórymi stałymi lub zmiennymi statycznymi, takimi jak ta AppConstants klasa:

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

Poniższy kod XAML przedstawia najbardziej pełne podejście do tworzenia wystąpienia StaticExtension klasy między tagami Label.FontSize właściwości-element:

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

Analizator XAML umożliwia StaticExtension również skrót klasy jako x:Static:

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

Tę składnię można jeszcze bardziej uprościć, umieszczając klasę StaticExtension i ustawienie składowe w nawiasach klamrowych. Wynikowe wyrażenie jest ustawiane bezpośrednio na FontSize atrybut:

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

W tym przykładzie nie ma znaków cudzysłowu w nawiasach klamrowych. Właściwość Member elementu StaticExtension nie jest już atrybutem XML. Zamiast tego jest częścią wyrażenia rozszerzenia znaczników.

Podobnie jak w przypadku używania go jako elementu obiektu można również skrócić x:StaticExtensionx:Static w wyrażeniu w nawiasach klamrowych:

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

Klasa StaticExtension ma ContentProperty atrybut odwołujący się do właściwości Member, która oznacza tę właściwość jako domyślną właściwość zawartości klasy. W przypadku rozszerzeń znaczników XAML wyrażonych za pomocą nawiasów klamrowych można wyeliminować Member= część wyrażenia:

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

Jest to najbardziej typowa forma x:Static rozszerzenia znaczników.

Główny tag przykładu XAML zawiera również deklarację przestrzeni nazw XML dla przestrzeni nazw platformy .NET System . Umożliwia to ustawienie rozmiaru Label czcionki na pole Math.PIstatyczne . Powoduje to raczej mały tekst, więc właściwość jest ustawiona Scale na Math.E:

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

Poniższy zrzut ekranu przedstawia dane wyjściowe XAML:

x:Reference markup extension (Rozszerzenie znaczników x:Reference)

Rozszerzenie x:Reference znaczników jest obsługiwane przez klasę ReferenceExtension . Klasa ma jedną właściwość o nazwie Name typustring, która została ustawiona na nazwę elementu na stronie, która ma nazwę .x:Name Ta Name właściwość jest właściwością ReferenceExtensionzawartości elementu , więc Name= nie jest wymagana, gdy x:Reference pojawia się w nawiasach klamrowych. Rozszerzenie x:Reference znaczników jest używane wyłącznie z powiązaniami danych. Aby uzyskać więcej informacji na temat powiązań danych, zobacz Powiązanie danych.

Poniższy przykład XAML przedstawia dwa zastosowania x:Reference z powiązaniami danych, pierwszy, w którym jest używany do ustawiania Source właściwości Binding obiektu, a drugi, w którym jest używany do ustawiania BindingContext właściwości dla dwóch powiązań danych:

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

W tym przykładzie oba x:Reference wyrażenia używają skróconej wersji ReferenceExtension nazwy klasy i eliminują Name= część wyrażenia. W pierwszym przykładzie x:Reference rozszerzenie znaczników jest osadzone w Binding rozszerzeniu znaczników, a Source właściwości i StringFormat są oddzielone przecinkami.

Poniższy zrzut ekranu przedstawia dane wyjściowe XAML:

x:Type, rozszerzenie znaczników

Rozszerzenie x:Type znaczników jest odpowiednikiem języka XAML słowa kluczowego języka C# typeof . Jest obsługiwana przez klasę TypeExtension , która definiuje właściwość o nazwie TypeName typu string , która powinna być ustawiona na nazwę klasy lub struktury. x:Type Rozszerzenie znaczników zwraca Type obiekt tej klasy lub struktury. TypeName jest właściwością zawartości , TypeExtensionwięc TypeName= nie jest wymagana, gdy x:Type jest wyświetlana z nawiasami klamrowymi.

Rozszerzenie x:Type znaczników jest często używane z x:Array rozszerzeniem znaczników. Aby uzyskać więcej informacji, zobacz rozszerzenie znaczników x:Array.

W poniższym przykładzie XAML pokazano użycie x:Type rozszerzenia znaczników w celu utworzenia wystąpienia obiektów .NET MAUI i dodania ich do obiektu StackLayout. Język XAML składa się z trzech Button elementów z ich Command właściwościami ustawionymi na wartość i BindingCommandParameter właściwości ustawionymi na typy trzech widoków maUI platformy .NET:

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

Plik za kodem definiuje i inicjuje CreateCommand właściwość :

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

Button Po naciśnięciu obiektu zostanie utworzone nowe wystąpienie argumentu CommandParameter i dodane do elementu StackLayout. Trzy Button obiekty następnie współdzielą stronę z dynamicznie utworzonymi widokami:

x:Array, rozszerzenie znaczników

x:Array Rozszerzenie znaczników umożliwia zdefiniowanie tablicy w znaczników. Jest obsługiwana przez klasę ArrayExtension , która definiuje dwie właściwości:

• Type typu Type, który wskazuje typ elementów w tablicy. Ta właściwość powinna być ustawiona x:Type na rozszerzenie znaczników.
• Items typu IList, który jest kolekcją samych elementów. Jest to właściwość zawartości .ArrayExtension

Samo x:Array rozszerzenie znaczników nigdy nie pojawia się w nawiasach klamrowych. x:Array Zamiast tego tagi początkowe i końcowe ograniczą listę elementów.

W poniższym przykładzie XAML pokazano, jak użyć x:Array polecenia , aby dodać elementy do obiektu ListView , ustawiając ItemsSource właściwość na tablicę:

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

W tym przykładzie element ViewCell tworzy prosty BoxView dla każdego wpisu koloru:

Uwaga

Podczas definiowania tablic typowych typów, takich jak ciągi lub liczby, użyj tagów pierwotnych języka XAML wymienionych w artykule Przekazywanie argumentów.

x:Null, rozszerzenie znaczników

Rozszerzenie x:Null znaczników jest obsługiwane przez klasę NullExtension . Nie ma właściwości i jest po prostu odpowiednikiem XAML słowa kluczowego języka C# null .

W poniższym przykładzie x:Null XAML pokazano, jak używać rozszerzenia znaczników:

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

W tym przykładzie zdefiniowano niejawną Style właściwość Label , która Setter ustawia FontFamily właściwość na określoną czcionkę. Jednak trzeci Label unika używania czcionki zdefiniowanej w stylu niejawnych, ustawiając dla niejawnego FontFamily parametru na x:Nullwartość :

Rozszerzenie znaczników DataTemplate

DataTemplate Rozszerzenie znaczników umożliwia konwertowanie typu na DataTemplate. Jest obsługiwana przez DataTemplateExtension klasę TypeName , która definiuje właściwość typu string, która jest ustawiona na nazwę typu, który ma zostać przekonwertowany na DataTemplate. Właściwość TypeName jest właściwością zawartości .DataTemplateExtension W związku z tym w przypadku wyrażeń znaczników XAML wyrażonych za pomocą nawiasów klamrowych można wyeliminować TypeName= część wyrażenia.

Uwaga

Analizator XAML umożliwia DataTemplateExtension skrót klasy jako DataTemplate.

Typowe użycie tego rozszerzenia znaczników znajduje się w aplikacji powłoki, jak pokazano w poniższym przykładzie:

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

W tym przykładzie MonkeysPage element jest konwertowany z ContentPage klasy DataTemplatena wartość , która jest ustawiana jako wartość ShellContent.ContentTemplate właściwości. Gwarantuje to, że MonkeysPage jest tworzony tylko wtedy, gdy nastąpi nawigacja na stronie, a nie podczas uruchamiania aplikacji.

Aby uzyskać więcej informacji na temat aplikacji powłoki, zobacz Powłoka.