Základní syntaxe XAML
XAML je většinou navržený pro vytváření instancí a inicializaci objektů. Často však musí být vlastnosti nastaveny na složité objekty, které nelze snadno reprezentovat jako řetězce XML, a někdy vlastnosti definované jednou třídou musí být nastaveny v podřízené třídě. Tyto dva požadavky vyžadují základní funkce syntaxe XAML elementů vlastností a připojených vlastností.
Elementy vlastností
V uživatelském rozhraní .NET Multi-Platform App UI (.NET MAUI) XAML se vlastnosti tříd obvykle nastavují jako atributy XML:
<Label Text="Hello, XAML!"
VerticalOptions="Center"
FontAttributes="Bold"
FontSize="18"
TextColor="Aqua" />
Existuje však alternativní způsob, jak nastavit vlastnost v XAML:
<Label Text="Hello, XAML!"
VerticalOptions="Center"
FontAttributes="Bold"
FontSize="18">
<Label.TextColor>
Aqua
</Label.TextColor>
</Label>
Tyto dva příklady, které určují TextColor
vlastnost, jsou funkčně ekvivalentní a umožňují zavedení některé základní terminologie:
- Label je objektový prvek. Jedná se o objekt .NET MAUI vyjádřený jako element XML.
Text
,VerticalOptions
FontAttributes
aFontSize
jsou atributy vlastností. Jedná se o vlastnosti .NET MAUI vyjádřené jako atributy XML.- V druhém příkladu
TextColor
se stal elementem vlastnosti. Jedná se o vlastnost .NET MAUI vyjádřenou jako element XML.
Poznámka:
V elementu vlastnosti je hodnota vlastnosti vždy definována jako obsah mezi počáteční a koncové značky element-element.
Syntaxi elementu property lze použít také u více než jedné vlastnosti objektu:
<Label Text="Hello, XAML!"
VerticalOptions="Center">
<Label.FontAttributes>
Bold
</Label.FontAttributes>
<Label.FontSize>
Large
</Label.FontSize>
<Label.TextColor>
Aqua
</Label.TextColor>
</Label>
I když se syntaxe elementu property může zdát zbytečná, je nezbytné, když je hodnota vlastnosti příliš složitá, aby byla vyjádřena jako jednoduchý řetězec. V rámci značek elementů vlastností můžete vytvořit instanci jiného objektu a nastavit jeho vlastnosti. Grid Například rozložení má vlastnosti pojmenované RowDefinitions
a ColumnDefinitions
, které jsou typu RowDefinitionCollection
a ColumnDefinitionCollection
v uvedeném pořadí. Tyto typy jsou kolekce a ColumnDefinition
objekty RowDefinition
a obvykle k jejich nastavení používáte syntaxi elementu property:
<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>
Připojené vlastnosti
V předchozím příkladu jste viděli, že Grid prvky vlastnosti pro objekty RowDefinitions
a ColumnDefinitions
kolekce definují řádky a sloupce. To naznačuje, že musí existovat technika pro označení řádku a sloupce, kde se nachází každá podřízená položka Grid .
V rámci značky pro každou podřízenou část Grid zadáte řádek a sloupec tohoto podřízeného objektu pomocí Grid.Column
Grid.Row
atributů, které mají výchozí hodnoty 0. Můžete také určit, jestli podřízená položka zahrnuje více než jeden řádek nebo sloupec s Grid.RowSpan
atributy, Grid.ColumnSpan
které mají výchozí hodnoty 1.
Následující příklad ukazuje umístění podřízených Gridpoložek do :
<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>
<Label Text="Autosized cell"
TextColor="White"
BackgroundColor="Blue" />
<BoxView Color="Silver"
Grid.Column="1" />
<BoxView Color="Teal"
Grid.Row="1" />
<Label Text="Leftover space"
Grid.Row="1" Grid.Column="1"
TextColor="Purple"
BackgroundColor="Aqua"
HorizontalTextAlignment="Center"
VerticalTextAlignment="Center" />
<Label Text="Span two rows (or more if you want)"
Grid.Column="2" Grid.RowSpan="2"
TextColor="Yellow"
BackgroundColor="Blue"
HorizontalTextAlignment="Center"
VerticalTextAlignment="Center" />
<Label Text="Span two columns"
Grid.Row="2" Grid.ColumnSpan="2"
TextColor="Blue"
BackgroundColor="Yellow"
HorizontalTextAlignment="Center"
VerticalTextAlignment="Center" />
<Label Text="Fixed 100x100"
Grid.Row="2" Grid.Column="2"
TextColor="Aqua"
BackgroundColor="Red"
HorizontalTextAlignment="Center"
VerticalTextAlignment="Center" />
</Grid>
</ContentPage>
Výsledkem tohoto xaml je následující rozložení:
Zdá Grid.Row
se, že Grid vlastnosti třídy , Grid.Column
, Grid.RowSpan
a Grid.ColumnSpan
atributy, ale tato třída nedefinuje nic pojmenovaného Row
, , Column
RowSpan
nebo ColumnSpan
. Grid Místo toho třída definuje čtyři bindable vlastnosti s názvem RowProperty
, ColumnProperty
, RowSpanProperty
a ColumnSpanProperty
, které jsou speciální typy bindable vlastnosti známé jako připojené vlastnosti. Jsou definovány Grid třídou, ale nastaveny na podřízené Gridpoložky .
Poznámka:
Pokud chcete tyto připojené vlastnosti použít v kódu, Grid třída poskytuje statické metody s názvem GetRow
, SetRow
, , SetColumn
GetColumn
, GetRowSpan
, SetRowSpan
, , GetColumnSpan
a SetColumnSpan
.
Připojené vlastnosti jsou rozpoznatelné v XAML jako atributy obsahující třídu i název vlastnosti oddělené tečkou. Nazývají se připojené vlastnosti , protože jsou definovány jednou třídou (v tomto případě Grid), ale připojeny k jiným objektům (v tomto případě podřízené položky Grid). Během rozložení může interrogovat hodnoty těchto připojených vlastností, abyste věděli, Grid kam umístit jednotlivé podřízené objekty.
Vlastnosti obsahu
V předchozím příkladu Grid byl objekt nastaven na Content
vlastnost ContentPage. Na Content
vlastnost se ale v XAML neodkazovala, ale může to být:
<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>
Vlastnost Content
není vyžadována v JAZYCE XAML, protože prvky definované pro použití v .NET MAUI XAML mají povoleno mít jednu vlastnost určenou ContentProperty
jako atribut třídy:
[ContentProperty("Content")]
public class ContentPage : TemplatedPage
{
...
}
Jakákoli vlastnost zadaná jako ContentProperty
třída znamená, že značky elementu property pro vlastnost nejsou vyžadovány. Výše uvedený příklad proto určuje, že k vlastnosti je přiřazen veškerý obsah XAML, který se zobrazí mezi počáteční a koncovou ContentPage značkou Content
.
Mnoho tříd má ContentProperty
také definice atributů. Například vlastnost Label obsahu je Text
.
Rozdíly mezi platformami
Aplikace .NET MAUI můžou přizpůsobit vzhled uživatelského rozhraní na základě jednotlivých platforem. Toho lze dosáhnout v XAML pomocí a OnPlatform
On
tříd:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="...">
<ContentPage.Padding>
<OnPlatform x:TypeArguments="Thickness">
<On Platform="iOS" Value="0,20,0,0" />
<On Platform="Android" Value="10,20,20,10" />
</OnPlatform>
</ContentPage.Padding>
...
</ContentPage>
OnPlatform
je obecná třída, takže je třeba zadat obecný typ argument, v tomto případě , Thickness
což je typ Padding
vlastnosti. Toho dosáhnete pomocí atributu x:TypeArguments
XAML. Třída OnPlatform
definuje Default
vlastnost, která se dá nastavit na hodnotu, která se použije na všechny platformy:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="...">
<ContentPage.Padding>
<OnPlatform x:TypeArguments="Thickness" Default="20">
<On Platform="iOS" Value="0,20,0,0" />
<On Platform="Android" Value="10,20,20,10" />
</OnPlatform>
</ContentPage.Padding>
...
</ContentPage>
V tomto příkladu Padding
je vlastnost nastavena na různé hodnoty v iOSu a Androidu, přičemž ostatní platformy jsou nastaveny na výchozí hodnotu.
Třída OnPlatform
také definuje Platforms
vlastnost, která je objekty IList
On
. Každý On
objekt může nastavit Platform
hodnotu a Value
vlastnost pro definování Thickness
hodnoty pro konkrétní platformu. Kromě toho Platform
vlastnost On
je typu IList<string>
, takže můžete zahrnout více platforem, pokud jsou hodnoty stejné:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="...">
<ContentPage.Padding>
<OnPlatform x:TypeArguments="Thickness" Default="20">
<On Platform="iOS, Android" Value="10,20,20,10" />
</OnPlatform>
</ContentPage.Padding>
...
</ContentPage>
Toto je standardní způsob nastavení vlastnosti závislé Padding
na platformě v JAZYCE XAML.
Poznámka:
Value
Pokud vlastnost objektu On
nemůže být reprezentována jedním řetězcem, můžete pro něj definovat prvky vlastnosti.
Další informace najdete v tématu Přizpůsobení vzhledu uživatelského rozhraní na základě platformy.
Další kroky
Rozšíření značek .NET MAUI XAML umožňují nastavit vlastnosti na objekty nebo hodnoty, na které se odkazuje nepřímo z jiných zdrojů. Rozšíření značek XAML jsou zvláště důležitá pro sdílení objektů a odkazování na konstanty používané v celé aplikaci.