今天解單的介紹一下XAML

什麼是XAML?

XAML是以XML為基礎的語言。可讓開發人員使用markup而不用code，就能在.NET MAUI app中定義使用者介面。

雖然官方說在MAUI應用程式中可以不需要使用XAML，但強烈建議用來開發UI的方法，原因在於簡潔、視覺化，並且有工具支援。並且XAML會定義透過XAML-based data bindings連結至viewmodel程式碼的檢視來搭配MVVM來進行開發。

在XAML檔案中，我們能使用所有 .NET MAUI views、layouts和pages，以及custom classes來定義UI。並且XAML 會在build time剖析以找出具名物件，並在runtime剖析 XAML所代表的物件會instantiated和initialized。

XAML基本語法

XAML 主要是針對instantiating和initializing object所設計。 但是，

1.屬性(properties)通常必須設定為無法輕易表示為 XML 字串的複雜物件，
2.有時一個類定義的屬性(properties)必須設置在子類上。

所以這兩個需求要使用XAML語法裡的兩個功能:

• property elements
• attached properties

property elements

在.NET MAUI XAML 中，類別的properties通常會設定為XML attributes

<Label Text="Hello, XAML!"
       VerticalOptions="Center"
       FontAttributes="Bold"
       FontSize="18"
       TextColor="Aqua" 
/>

or

<Label Text="Hello, XAML!"
       VerticalOptions="Center"
       FontAttributes="Bold"
       FontSize="18">
    <Label.TextColor>
        Aqua
    </Label.TextColor>
</Label>

• Label是object element，以 XML 專案表示的 .NET MAUI 物件
• Text、 VerticalOptionsFontAttributes 和 FontSize 是property element。 它們是以XML attributes工作表示的 .NET MAUI properties
• 第二個範例中，TextColor變成了property element。用XML element表示的 .NET MAUI property

attached properties

在 Grid裡，我們能使用 Grid.Row和Grid.Column attributes來指定該子類的資料列和資料行
ex.

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="XamlSamples.GridDemoPage"
             Title="Grid Demo Page">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
            <RowDefinition Height="100" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="100" />
        </Grid.ColumnDefinitions>

        .........

    </Grid>
</ContentPage>

Grid 會定義名為RowProperty 、ColumnProperty、RowSpanProperty 和ColumnSpanProperty四個bindable properties，這些property被稱為attached properties的special types of bindable properties。它們是由Grid的class所定義，並在的Grid子類上設定。

Content properties

XAML 中未引用 Content property，卻可以使用下列方法:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="XamlSamples.XamlPlusCodePage"
             Title="XAML + Code Page">
    <ContentPage.Content>
        <Grid>
            ...
        </Grid>
    </ContentPage.Content>
</ContentPage>

因為定義在 .NET MAUI XAML中使用的elements可以有一個property指定為 ContentProperty 類別上的attribute

[ContentProperty("Content")]
public class ContentPage : TemplatedPage
{
    ...
}

所以任何指定為的ContentProperty的property類不需要該property的property-element tags。

因此，上面的示例指定將出現在開始和結束 ContentPage 標記之間的任何 XAML 內容分配給 Content property。

今天簡單的說明什麼是XAML後，明天開始練習在我們app專案中使用來定義我們的UI

Ref