Tipos e propriedades em .NET MAUI XAML
XAML é uma linguagem de marcação declarativa. Ele foi projetado com a ideia de simplificar o processo de criação de sua interface do usuário. Os elementos em XAML representam diretamente a instanciação de objetos que você acessa em arquivos code-behind.
Nesta unidade, você aprenderá como usar os tipos disponíveis em XAML e como definir e ler propriedades desses tipos.
Onde são definidos os tipos?
O .NET MAUI implementa um analisador XAML que analisa seus elementos XAML declarados e instancia cada elemento como um tipo .NET. O dialeto XAML que o analisador .NET MAUI entende é específico do .NET MAUI, embora seja semelhante ao XAML usado por outras estruturas, como o Windows Presentation Foundation.
Os tipos .NET que implementam os itens que o código XAML identifica são implementados por código em vários assemblies .NET. Muitos desses assemblies são incluídos como parte dos modelos .NET MAUI. Você também pode utilizar outros tipos personalizados carregando os assemblies apropriados como parte do seu projeto. Muitos assemblies estão disponíveis como pacotes NuGet. A maioria dos tipos comuns que um aplicativo MAUI usa estão nos pacotes Microsoft.Maui.Dependencies e Microsoft.Maui.Extensions .
Cada tipo é definido em um namespace. Em seu código XAML, você especifica os namespaces para os tipos aos quais faz referência. A maioria dos controles MAUI está localizada no namespace Microsoft.Maui.Controls , enquanto o namespace Microsoft.Maui define tipos de utilitários como Thickness, e o namespace Microsoft.Maui.Graphics inclui tipos generalizados como Color. A opção de introduzir tipos dessa maneira destaca a extensibilidade do XAML. O XAML permite que você crie a interface do usuário do seu aplicativo com a liberdade de incluir elementos .NET MAUI XAML, tipos .NET e tipos personalizados. Na maioria das vezes, você não precisa se preocupar com esses namespaces, pois eles são trazidos usando o recurso implícito usings do C# que os adiciona automaticamente em todo o aplicativo.
Como instanciar tipos em XAML
A primeira etapa no uso de XAML para criar uma interface do usuário é instanciar os tipos de controle da interface do usuário. Em XAML, você pode criar um objeto de um tipo especificado usando a sintaxe do elemento Object. Object Element Syntax é uma sintaxe XML padrão e bem formada para declarar um elemento. Por exemplo, se você quiser criar um rótulo com uma cor específica, seu elemento XAML será semelhante ao código a seguir:
<Label TextColor="AntiqueWhite"/>
O analisador .NET MAUI XAML analisa esse elemento XAML para instanciar o objeto na memória. Efetivamente, o rótulo XAML analisado é o mesmo que o seguinte código C#:
var myLabel = new Label
{
TextColor = Color.FromRgb(255, 255, 100)
};
O que é um namespace XAML?
Lembre-se de que, para que o analisador XAML analise com êxito a definição XAML de um controle em uma página, ele deve ter acesso ao código que implementa o controle e define suas propriedades. Os controles disponíveis para uma página MAUI .NET são implementados em uma coleção de assemblies que são instalados como parte do pacote Microsoft.Maui NuGet. Os controles estão localizados em um namespace .NET nesses assemblies. No código C#, você traz um namespace para o escopo com a using diretiva. Em uma página XAML, você faz referência a um namespace com o xmlns atributo da página. O código a seguir mostra os namespaces que a página XAML criada na unidade anterior usa:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
...>
...
</ContentPage>
O primeiro namespace, http://schemas.microsoft.com/dotnet/2021/maui, é o namespace padrão da página. Essa forma de URI de namespace é típica de XML e parece um pouco diferente daqueles com os quais você pode estar familiarizado em C#. No entanto, esse URI é simplesmente um alias para um ou mais dos namespaces definidos pelos assemblies no pacote NuGet Microsoft.Maui , portanto, especificar esse namespace no início da página traz todos os tipos e controles do .NET MAUI para o escopo. Se você omitir esse namespace, não poderá usar controles como Button, Label, Entry, ou StackLayout.
O segundo namespace, http://schemas.microsoft.com/winfx/2009/xaml, faz referência aos assemblies que contêm os vários tipos intrínsecos do .NET, como cadeias de caracteres, números e propriedades. No código XAML anterior, esse namespace recebe o alias x. No código XAML desta página, você faz referência aos tipos neste namespace prefixando-os com x:. Por exemplo, cada página XAML é compilada em uma classe e você especifica o nome da classe gerada com o atributo x:Class da página:
<ContentPage ...
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="MauiXaml.Page1"
...>
...
</ContentPage>
Você pode fazer referência a tipos em seus próprios assemblies em código XAML por meio de um namespace XAML. Por exemplo, se você tiver tipos e métodos que deseja usar em seu código XAML definidos em um namespace chamado Utils em seu projeto, poderá adicionar o namespace Utils à página, conforme mostrado no código a seguir. Neste exemplo, você acessa os tipos neste namespace prefixando-os com o alias mycode.
<ContentPage ...
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:mycode="clr-namespace:Utils"
...>
...
</ContentPage>
Nota
Você verá mais exemplos dessa técnica mais adiante neste módulo.
Como especificar valores de propriedade em XAML
Em XML, você usa atributos para descrever ou fornecer informações sobre um elemento. Em XAML, você usa atributos para definir propriedades no tipo subjacente. Por exemplo, considerando o seguinte código C#:
var label = new Label { Text = "Username", TextColor = Color.Black };
Esta instrução cria um novo Label objeto e define as Text propriedades e TextColor . Para definir propriedades em XAML, use atributos. O código XAML correspondente tem esta aparência:
<Label Text="Username" TextColor="Black" />
Uma coisa que você pode notar que é diferente no código XAML do código C# são os valores de propriedade. Por exemplo, no código C#, você usa o Color tipo para a TextColor propriedade. No entanto, na definição XAML, você define TextColor com um valor de cadeia de caracteres. Isso ocorre porque uma cadeia de caracteres é o único elemento válido que você pode usar para um valor de atributo XML. Portanto, precisa haver uma maneira de converter cada valor de cadeia de caracteres para seu tipo correto. Em XAML, você pode fazer essa conversão usando um Conversor de Tipo.
O que é um conversor de tipo?
Um conversor de tipo converte um atributo XML especificado como um valor de cadeia de caracteres para seu tipo correto. Para entender melhor esse conceito, considere o seguinte exemplo:
<Label Text="Username" TextColor="Black" FontSize="42" FontAttributes="Bold,Italic" />
Esse código cria um Label e define suas Textpropriedades , TextColor, FontSize, e FontAttributes .
Comece com a primeira propriedade, Text. O texto já é uma cadeia de caracteres, o que significa que a página XAML não precisa de um conversor de tipo. Em seguida, TextColor usa o tipo, portanto, o Color XAML requer um conversor de tipo para traduzir a cadeia de caracteres no valor correspondente Color . A FontSize propriedade é um inteiro, portanto, o XAML requer um conversor de tipo para analisar a cadeia de caracteres para um inteiro. Finalmente, FontAttributes é um exemplo de um objeto complexo. Você pode combinar os valores como uma cadeia delimitada por vírgula: "Negrito,Itálico". A cadeia de caracteres delimitada por vírgulas é tratada como uma enumeração baseada em [Flags] e o conversor de tipo apropriado aplicará o bit a bit OR do valor à propriedade.
O .NET MAUI tem conversores de tipo para a maioria das classes internas e usa esses conversores de tipo automaticamente. No entanto, se um conversor específico não existir, você poderá escrever o seu próprio e associá-lo ao seu tipo para torná-lo utilizável em XAML.
Atribuição de tipo complexo
Os conversores de tipo são ótimos para configurações de propriedade simples; No entanto, em alguns casos, você precisa criar um objeto completo com seus próprios valores de propriedade. A solução para esse problema é alterar a atribuição de propriedade para usar uma sintaxe baseada em elemento. Essa sintaxe é chamada de formulário Elemento de propriedade . Essa sintaxe envolve a divisão do setter de propriedades no formulário pai-filho, onde a propriedade é expressa em uma marca de elemento do formulário Type.PropertyName. Suponha que você queira atribuir um reconhecedor de gestos a um rótulo para que o usuário do aplicativo possa tocar no rótulo. O reconhecedor de gestos é um objeto complexo com suas próprias propriedades. Normalmente, essas propriedades precisam ser atribuídas para garantir a funcionalidade adequada:
<TapGestureRecognizer NumberOfTapsRequired="2" />
Se precisar atribuir esse valor a um Label, você pode escrever o XAML da seguinte forma:
<Label Text="Username" TextColor="Black" FontSize="42" FontAttributes="Bold,Italic">
<Label.GestureRecognizers>
<TapGestureRecognizer NumberOfTapsRequired="2" />
</Label.GestureRecognizers>
</Label>
O Label tipo tem uma propriedade chamada GestureRecognizers. Usando o formulário Elemento de propriedade , você pode adicionar um TapGestureRecognizer à lista de gestos para o Label.
Propriedade de conteúdo padrão
Alguns controles .NET MAUI têm uma propriedade de conteúdo padrão. A propriedade content permite especificar o valor de uma propriedade em um controle sem explicitá-lo em XAML. Dê uma olhada no seguinte fragmento XAML:
<VerticalStackLayout>
<VerticalStackLayout.Children>
<Label Text="Please log in" />
</VerticalStackLayout.Children>
</VerticalStackLayout>
Este código cria um VerticalStackLayout e adiciona um Label como um elemento filho. Como é comum adicionar filhos a um VerticalStackLayout, sua Children propriedade é a propriedade de conteúdo padrão. Isso significa que você pode adicionar um filho sem especificar explicitamente o Children, da seguinte maneira:
<VerticalStackLayout>
<Label Text="Please log in" />
</VerticalStackLayout>