Consumo de extensões de marcação do XAML

Baixar exemplo Baixar o exemplo

As extensões de marcação XAML ajudam a aprimorar a potência e a flexibilidade do XAML, permitindo que os atributos de elemento sejam definidos de uma variedade de fontes. Várias extensões de marcação XAML fazem parte da especificação XAML 2009. Elas aparecem em arquivos XAML com o prefixo de namespace personalizado x e geralmente são referenciadas com esse prefixo. Este artigo discute as seguintes extensões de marcação:

  • x:Static – referenciar propriedades estáticas, campos ou membros de enumeração.
  • x:Reference – referencie elementos nomeados na página.
  • x:Type – defina um atributo como um System.Type objeto .
  • x:Array – construa uma matriz de objetos de um tipo específico.
  • x:Null – defina um atributo como um null valor.
  • OnPlatform – personalizar a aparência da interface do usuário por plataforma.
  • OnIdiom – personalize a aparência da interface do usuário com base no idioma do dispositivo em que o aplicativo está sendo executado.
  • DataTemplate – converte um tipo em um DataTemplate.
  • FontImage – exibir um ícone de fonte em qualquer exibição que possa exibir um ImageSource.
  • AppThemeBinding – consumir um recurso com base no tema atual do sistema.

Extensões de marcação XAML adicionais historicamente têm suporte por outras implementações XAML e também têm suporte pelo Xamarin.Forms. Elas são descritas mais detalhadamente em outros artigos:

  • StaticResource – referencia objetos de um dicionário de recursos, conforme descrito no artigo Dicionários de Recursos.
  • DynamicResource – responder a alterações em objetos em um dicionário de recursos, conforme descrito no artigo Estilos Dinâmicos.
  • Binding – estabelecer um vínculo entre propriedades de dois objetos, conforme descrito no artigo Associação de Dados.
  • TemplateBinding– executa a associação de dados de um modelo de controle, conforme discutido nos modelos de controle de artigoXamarin.Forms.
  • RelativeSource – define a origem da associação em relação à posição do destino de associação, conforme discutido no artigo Associações Relativas.

O RelativeLayout layout usa a extensão de marcação ConstraintExpressionpersonalizada . Essa extensão de marcação é descrita no artigo RelativeLayout.

Extensão de marcação x:Static

A x:Static extensão de marcação é compatível com a StaticExtension classe . A classe tem uma única propriedade chamada Member de tipo string que você define como o nome de uma constante pública, propriedade estática, campo estático ou membro de enumeração.

Uma maneira comum de usar x:Static é primeiro definir uma classe com algumas constantes ou variáveis estáticas, como essa classe minúscula AppConstants no programa MarkupExtensions :

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

A página x:Static Demo demonstra várias maneiras de usar a x:Static extensão de marcação. A abordagem mais detalhada cria uma instância da StaticExtension classe entre Label.FontSize marcas de elemento de propriedade:

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

O analisador XAML também permite que a StaticExtension classe seja abreviada como x:Static:

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

Isso pode ser simplificado ainda mais, mas a alteração introduz alguma nova sintaxe: consiste em colocar a StaticExtension classe e a configuração de membro em chaves. A expressão resultante é definida diretamente para o FontSize atributo :

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

Observe que não há aspas dentro das chaves. A Member propriedade de StaticExtension não é mais um atributo XML. Em vez disso, faz parte da expressão para a extensão de marcação.

Assim como você pode abreviar x:StaticExtension ao x:Static usá-lo como um elemento de objeto, você também pode abreviar na expressão dentro de chaves:

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

A StaticExtension classe tem um ContentProperty atributo que faz referência à propriedade Member, que marca essa propriedade como a propriedade de conteúdo padrão da classe. Para extensões de marcação XAML expressas com chaves, você pode eliminar a Member= parte da expressão:

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

Essa é a forma mais comum da x:Static extensão de marcação.

A página Demonstração Estática contém dois outros exemplos. A marca raiz do arquivo XAML contém uma declaração de namespace XML para o namespace do .NET System :

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

Isso permite que o tamanho da Label fonte seja definido como o campo Math.PIestático . Isso resulta em um texto bastante pequeno, portanto, a Scale propriedade é definida como Math.E:

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

O exemplo final exibe o Device.RuntimePlatform valor . A Environment.NewLine propriedade estática é usada para inserir um caractere de nova linha entre os dois Span objetos:

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

Este é o exemplo em execução:

x:Demonstração Estática

Extensão de marcação x:Reference

A x:Reference extensão de marcação é compatível com a ReferenceExtension classe . A classe tem uma única propriedade chamada Name de tipo string que você definiu como o nome de um elemento na página que recebeu um nome com x:Name. Essa Name propriedade é a propriedade de conteúdo de ReferenceExtension, portanto Name= , não é necessária quando x:Reference aparece em chaves.

A x:Reference extensão de marcação é usada exclusivamente com associações de dados, que são descritas mais detalhadamente no artigo Associação de Dados.

A página demonstração x:Reference mostra dois usos de com associações de x:Reference dados, o primeiro em que é usado para definir a Source propriedade do Binding objeto e o segundo em que ele é usado para definir a BindingContext propriedade para duas associações de dados:

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

Ambas as x:Reference expressões usam a versão abreviada do nome da ReferenceExtension classe e eliminam a Name= parte da expressão. No primeiro exemplo, a x:Reference extensão de marcação é inserida na Binding extensão de marcação. Observe que as Source configurações e StringFormat são separadas por vírgulas. Este é o programa em execução:

Reference Demo x:Reference Demo

Extensão de marcação x:Type

A x:Type extensão de marcação é o equivalente XAML da palavra-chave C typeof #. Ele é compatível com a TypeExtension classe , que define uma propriedade chamada TypeName de tipo string que é definida como um nome de classe ou estrutura. A x:Type extensão de marcação retorna o System.Type objeto dessa classe ou estrutura. TypeName é a propriedade de conteúdo de TypeExtension, portanto TypeName= , não é necessário quando x:Type aparece com chaves.

No Xamarin.Forms, há várias propriedades que têm argumentos do tipo Type. Os exemplos incluem a TargetType propriedade de Stylee o atributo x:TypeArguments usado para especificar argumentos em classes genéricas. No entanto, o analisador XAML executa a typeof operação automaticamente e a x:Type extensão de marcação não é usada nesses casos.

Um local em que x:Typeé necessário é com a x:Array extensão de marcação, que é descrita na próxima seção.

A x:Type extensão de marcação também é útil ao construir um menu em que cada item de menu corresponde a um objeto de um tipo específico. Você pode associar um Type objeto a cada item de menu e, em seguida, instanciar o objeto quando o item de menu for selecionado.

É assim que funciona o menu de navegação no MainPage programa Extensões de Marcação . O arquivo MainPage.xaml contém um TableView com cada TextCell correspondente a uma página específica no programa:

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

Esta é a página de abertura main em Extensões de Marcação:

Principal página principalPágina

Cada CommandParameter propriedade é definida como uma x:Type extensão de marcação que faz referência a uma das outras páginas. A Command propriedade está associada a uma propriedade chamada NavigateCommand. Essa propriedade é definida no MainPage arquivo code-behind:

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

A NavigateCommand propriedade é um Command objeto que implementa um comando execute com um argumento do tipo Type — o valor de CommandParameter. O método usa Activator.CreateInstance para instanciar a página e, em seguida, navega até ela. O construtor é concluído definindo o BindingContext da página para si mesmo, o que permite que o BindingCommand ativado funcione. Consulte o artigo Associação de Dados e, particularmente, o artigo Comando para obter mais detalhes sobre esse tipo de código.

A página demonstração x:Type usa uma técnica semelhante para instanciar Xamarin.Forms elementos e adicioná-los a um StackLayout. O arquivo XAML consiste inicialmente em três Button elementos com suas Command propriedades definidas como um Binding e as CommandParameter propriedades definidas como tipos de três Xamarin.Forms exibições:

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

O arquivo code-behind define e inicializa a CreateCommand propriedade :

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

O método executado quando um Button é pressionado cria uma nova instância do argumento, define sua VerticalOptions propriedade e a adiciona ao StackLayout. Em seguida, os três Button elementos compartilham a página com exibições criadas dinamicamente:

x:Type Demo

Extensão de marcação x:Array

A x:Array extensão de marcação permite que você defina uma matriz na marcação. Ele é compatível com a ArrayExtension classe , que define duas propriedades:

  • Type do tipo Type, que indica o tipo dos elementos na matriz.
  • Items do tipo IList, que é uma coleção dos próprios itens. Essa é a propriedade de conteúdo de ArrayExtension.

A x:Array própria extensão de marcação nunca aparece em chaves. Em vez disso, x:Array as marcas start e end delimitam a lista de itens. Defina a Type propriedade como uma x:Type extensão de marcação.

A página demonstração x:Array mostra como usar x:Array para adicionar itens a um ListView definindo a ItemsSource propriedade como uma matriz:

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

O ViewCell cria um simples BoxView para cada entrada de cor:

:Array x:Array Demo

Há várias maneiras de especificar os itens individuais Color nesta matriz. Você pode usar uma x:Static extensão de marcação:

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

Ou você pode usar StaticResource para recuperar uma cor de um dicionário de recursos:

<StaticResource Key="myColor" />

No final deste artigo, você verá uma extensão de marcação XAML personalizada que também cria um novo valor de cor:

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

Ao definir matrizes de tipos comuns, como cadeias de caracteres ou números, use as marcas listadas no artigo Passando Argumentos do Construtor para delimitar os valores.

Extensão de marcação x:Null

A x:Null extensão de marcação é compatível com a NullExtension classe . Ele não tem propriedades e é simplesmente o equivalente XAML do palavra-chave C null #.

A x:Null extensão de marcação raramente é necessária e raramente usada, mas se você encontrar uma necessidade para ela, ficará feliz que ela exista.

A página demonstração x:Null ilustra um cenário em x:Null que pode ser conveniente. Suponha que você defina um implícito Style para Label que inclua um Setter que define a FontFamily propriedade como um nome de família dependente da plataforma:

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

Em seguida, você descobre que, para um dos Label elementos, deseja todas as configurações de propriedade no implícito Style , exceto para o FontFamily, que você deseja ser o valor padrão. Você pode definir outro Style para essa finalidade, mas uma abordagem mais simples é simplesmente definir a FontFamily propriedade do específico Label como x:Null, conforme demonstrado no centro Label.

Este é o programa em execução:

x:Null Demo

Observe que quatro dos Label elementos têm uma fonte serif, mas o centro Label tem a fonte sans-serif padrão.

Extensão de marcação OnPlatform

A extensão de marcação OnPlatform permite que você personalize a aparência da interface do usuário por plataforma. Ele fornece a mesma funcionalidade que as OnPlatform classes e On , mas com uma representação mais concisa.

A OnPlatform extensão de marcação é compatível com a OnPlatformExtension classe , que define as seguintes propriedades:

  • Default do tipo object, que você define como um valor padrão a ser aplicado às propriedades que representam plataformas.
  • Android do tipo object, que você define como um valor a ser aplicado no Android.
  • GTK do tipo object, que você define como um valor a ser aplicado em plataformas GTK.
  • iOS do tipo object, que você define como um valor a ser aplicado no iOS.
  • macOS do tipo object, que você define como um valor a ser aplicado no macOS.
  • Tizen do tipo object, que você define como um valor a ser aplicado na plataforma Tizen.
  • UWPdo tipo object, que você define como um valor a ser aplicado no Plataforma Universal do Windows.
  • WPFdo tipo object, que você define como um valor a ser aplicado na plataforma Windows Presentation Foundation.
  • Converter do tipo IValueConverter, que pode ser definido como uma implementação IValueConverter .
  • ConverterParameter do tipo object, que pode ser definido como um valor a ser passado para a IValueConverter implementação.

Observação

O analisador XAML permite que a OnPlatformExtension classe seja abreviada como OnPlatform.

A Default propriedade é a propriedade de conteúdo de OnPlatformExtension. Portanto, para expressões de marcação XAML expressas com chaves, você pode eliminar a Default= parte da expressão desde que seja o primeiro argumento. Se a Default propriedade não estiver definida, ela usará como padrão o valor da BindableProperty.DefaultValue propriedade, desde que a extensão de marcação esteja direcionada a um BindableProperty.

Importante

O analisador XAML espera que os valores do tipo correto sejam fornecidos às propriedades que consomem a OnPlatform extensão de marcação. Se a conversão de tipo for necessária, a OnPlatform extensão de marcação tentará executá-la usando os conversores padrão fornecidos por Xamarin.Forms. No entanto, há algumas conversões de tipo que não podem ser executadas pelos conversores padrão e, nesses casos, a Converter propriedade deve ser definida como uma implementação IValueConverter .

A página Demonstração do OnPlatform mostra como usar a OnPlatform extensão de marcação:

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

Neste exemplo, todas as três OnPlatform expressões usam a versão abreviada do nome da OnPlatformExtension classe. As três OnPlatform extensões de marcação definem as Colorpropriedades , WidthRequeste HeightRequest do BoxView para valores diferentes no iOS, Android e UWP. As extensões de marcação também fornecem valores padrão para essas propriedades nas plataformas que não são especificadas, eliminando a Default= parte da expressão. Observe que as propriedades da extensão de marcação definidas são separadas por vírgulas.

Este é o programa em execução:

OnPlatform OnPlatform Demo OnPlatform

Extensão de marcação OnIdiom

A OnIdiom extensão de marcação permite personalizar a aparência da interface do usuário com base no idioma do dispositivo em que o aplicativo está sendo executado. Ele é compatível com a OnIdiomExtension classe , que define as seguintes propriedades:

  • Default do tipo object, que você define como um valor padrão a ser aplicado às propriedades que representam os idiomas do dispositivo.
  • Phone do tipo object, que você define como um valor a ser aplicado em telefones.
  • Tablet do tipo object, que você define como um valor a ser aplicado em tablets.
  • Desktop do tipo object, que você define como um valor a ser aplicado em plataformas de área de trabalho.
  • TV do tipo object, que você define como um valor a ser aplicado em plataformas de TV.
  • Watch do tipo object, que você define como um valor a ser aplicado em plataformas watch.
  • Converter do tipo IValueConverter, que pode ser definido como uma implementação IValueConverter .
  • ConverterParameter do tipo object, que pode ser definido como um valor a ser passado para a IValueConverter implementação.

Observação

O analisador XAML permite que a OnIdiomExtension classe seja abreviada como OnIdiom.

A Default propriedade é a propriedade de conteúdo de OnIdiomExtension. Portanto, para expressões de marcação XAML expressas com chaves, você pode eliminar a Default= parte da expressão desde que seja o primeiro argumento.

Importante

O analisador XAML espera que os valores do tipo correto sejam fornecidos às propriedades que consomem a OnIdiom extensão de marcação. Se a conversão de tipo for necessária, a OnIdiom extensão de marcação tentará executá-la usando os conversores padrão fornecidos por Xamarin.Forms. No entanto, há algumas conversões de tipo que não podem ser executadas pelos conversores padrão e, nesses casos, a Converter propriedade deve ser definida como uma implementação IValueConverter .

A página Demonstração onIdiom mostra como usar a OnIdiom extensão de marcação:

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

Neste exemplo, todas as três OnIdiom expressões usam a versão abreviada do nome da OnIdiomExtension classe. As três OnIdiom extensões de marcação definem as Colorpropriedades , WidthRequeste HeightRequest do BoxView para valores diferentes no telefone, tablet e idiomas da área de trabalho. As extensões de marcação também fornecem valores padrão para essas propriedades nos idiomas que não são especificados, eliminando a Default= parte da expressão. Observe que as propriedades da extensão de marcação definidas são separadas por vírgulas.

Este é o programa em execução:

onIdiom Demo

Extensão de marcação DataTemplate

A DataTemplate extensão de marcação permite converter um tipo em um DataTemplate. Ele é compatível com a DataTemplateExtension classe , que define uma TypeName propriedade, do tipo string, que é definida como o nome do tipo a ser convertido em um DataTemplate. A TypeName propriedade é a propriedade de conteúdo de DataTemplateExtension. Portanto, para expressões de marcação XAML expressas com chaves, você pode eliminar a TypeName= parte da expressão.

Observação

O analisador XAML permite que a DataTemplateExtension classe seja abreviada como DataTemplate.

Um uso típico dessa extensão de marcação está em um aplicativo Shell, conforme mostrado no exemplo a seguir:

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

Neste exemplo, MonkeysPage é convertido de um ContentPage para um DataTemplate, que é definido como o valor da ShellContent.ContentTemplate propriedade . Isso garante que MonkeysPage só seja criado quando a navegação para a página ocorrer, em vez de na inicialização do aplicativo.

Para obter mais informações sobre aplicativos Shell, consulte Xamarin.Forms Shell.

Extensão de marcação FontImage

A FontImage extensão de marcação permite exibir um ícone de fonte em qualquer exibição que possa exibir um ImageSource. Ele fornece a mesma funcionalidade que a FontImageSource classe , mas com uma representação mais concisa.

A FontImage extensão de marcação é compatível com a FontImageExtension classe , que define as seguintes propriedades:

  • FontFamily do tipo string, a família de fontes à qual o ícone de fonte pertence.
  • Glyph do tipo string, o valor de caractere unicode do ícone de fonte.
  • Color do tipo Color, a cor a ser usada ao exibir o ícone de fonte.
  • Size do tipo double, o tamanho, em unidades independentes do dispositivo, do ícone de fonte renderizada. O valor padrão é 30. Além disso, essa propriedade pode ser definida como um tamanho de fonte nomeado.

Observação

O analisador XAML permite que a FontImageExtension classe seja abreviada como FontImage.

A Glyph propriedade é a propriedade de conteúdo de FontImageExtension. Portanto, para expressões de marcação XAML expressas com chaves, você pode eliminar a Glyph= parte da expressão desde que seja o primeiro argumento.

A página Demonstração fontImage mostra como usar a FontImage extensão de marcação:

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

Neste exemplo, a versão abreviada do nome da FontImageExtension classe é usada para exibir um ícone XBox, da família de fontes Ionicons, em um Image. A expressão também usa a OnPlatform extensão de marcação para especificar valores de propriedade diferentes FontFamily no iOS e no Android. Além disso, a Glyph= parte da expressão é eliminada e as propriedades de extensão de marcação definidas são separadas por vírgulas. Observe que, embora o caractere unicode para o ícone seja \uf30c, ele precisa ser escapado no XAML e, portanto, torna-se &#xf30c;.

Este é o programa em execução:

Captura de tela da demonstração FontImage da demonstração da extensão de marcação FontImage

Para obter informações sobre como exibir ícones de fonte especificando os dados de ícone de fonte em um FontImageSource objeto, consulte Exibir ícones de fonte.

Extensão de marcação AppThemeBinding

A AppThemeBinding extensão de marcação permite que você especifique um recurso a ser consumido, como uma imagem ou cor, com base no tema atual do sistema.

Importante

A AppThemeBinding extensão de marcação tem requisitos mínimos do sistema operacional. Para obter mais informações, consulte Responder a alterações de tema do sistema em Xamarin.Forms aplicativos.

A AppThemeBinding extensão de marcação é compatível com a AppThemeBindingExtension classe , que define as seguintes propriedades:

  • Default, do tipo object, que você define como o recurso a ser usado por padrão.
  • Light, do tipo object, que você define como o recurso a ser usado quando o dispositivo está usando seu tema claro.
  • Dark, do tipo object, que você define como o recurso a ser usado quando o dispositivo está usando seu tema escuro.
  • Value, do tipo object, que retorna o recurso que está sendo usado atualmente pela extensão de marcação.

Observação

O analisador XAML permite que a AppThemeBindingExtension classe seja abreviada como AppBindingTheme.

A Default propriedade é a propriedade de conteúdo de AppThemeBindingExtension. Portanto, para expressões de marcação XAML expressas com chaves, você pode eliminar a Default= parte da expressão desde que seja o primeiro argumento.

A página Demonstração AppThemeBinding mostra como usar a AppThemeBinding extensão de marcação:

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

Neste exemplo, a cor do texto da primeira Label é definida como verde quando o dispositivo está usando seu tema claro e é definida como vermelho quando o dispositivo está usando seu tema escuro. O segundo Label tem sua TextColor propriedade definida por meio de um Style. Isso Style define a cor do texto do Label como preto por padrão, como azul quando o dispositivo está usando seu tema claro e para teal quando o dispositivo está usando seu tema escuro.

Este é o programa em execução:

AppThemeBinding Demo

Definir extensões de marcação

Se você encontrou uma necessidade de uma extensão de marcação XAML que não está disponível no Xamarin.Forms, você pode criar sua própria.