Typen en eigenschappen in .NET MAUI XAML

Voltooid

XAML is een declaratieve opmaaktaal. Het is ontworpen met het idee om het proces van het maken van uw gebruikersinterface te vereenvoudigen. De elementen in XAML vertegenwoordigen rechtstreeks de instantiëring van objecten die u opent in code-behind-bestanden.

In deze les leert u hoe u de typen gebruikt die beschikbaar zijn in XAML en hoe u eigenschappen van deze typen instelt en leest.

Waar worden typen gedefinieerd?

.NET MAUI implementeert een XAML-parser waarmee uw gedeclareerde XAML-elementen worden geparseerd en elk element wordt geïnstitueerd als een .NET-type. Het XAML-dialect dat de .NET-PARSer begrijpt, is specifiek voor .NET MAUI, hoewel het vergelijkbaar is met XAML andere frameworks, zoals Windows Presentation Foundation.

De .NET-typen die de items implementeren die XAML-code identificeert, worden geïmplementeerd door code in verschillende .NET-assembly's. Veel van deze assembly's zijn opgenomen als onderdeel van de .NET MAUI-sjablonen. U kunt ook andere aangepaste typen gebruiken door de juiste assembly's te laden als onderdeel van uw project. Veel assembly's zijn beschikbaar als NuGet-pakketten. De meeste van de meest voorkomende typen die worden gebruikt in de pakketten Microsoft.Maui.Dependencies en Microsoft.Maui.Extensions .

Elk type wordt gedefinieerd in een naamruimte. In uw XAML-code geeft u de naamruimten op voor de typen waarnaar u verwijst. De meeste CONTROLS-besturingselementen bevinden zich in de naamruimte Microsoft.Maui.Controls, terwijl de naamruimte Microsoft.Maui hulpprogrammatypen definieert, zoals Thickness, en de naamruimte Microsoft.Maui.Graphics bevat gegeneraliseerde typen zoals Color. De optie voor het introduceren van typen op deze manier markeert de uitbreidbaarheid van XAML. Met XAML kunt u de gebruikersinterface van uw app maken met de vrijheid om .NET MAUI XAML-elementen, .NET-typen en aangepaste typen op te nemen. Voor het grootste deel hoeft u zich geen zorgen te maken over deze naamruimten, omdat ze gebruikmaken van de impliciete usings functie van C# waarmee ze automatisch app-breed worden toegevoegd.

Typen instantiëren in XAML

De eerste stap bij het gebruik van XAML om een gebruikersinterface te bouwen, is het instantiëren van de typen ui-besturingselementen. In XAML kunt u een object van een opgegeven type maken met behulp van objectelementsyntaxis. Syntaxis van objectelement is een standaard, goed opgemaakte XML-syntaxis om een element te declareren. Als u bijvoorbeeld een label met een specifieke kleur wilt maken, ziet het XAML-element eruit als de volgende code:

<Label TextColor="AntiqueWhite"/>

De .NET MAUI XAML-parser parseert dit XAML-element om het object in het geheugen te instantiëren. Het geparseerde XAML-label is in feite hetzelfde als de volgende C#-code:

var myLabel = new Label
{
  TextColor = Color.FromRgb(255, 255, 100)
};

Wat is een XAML-naamruimte?

Houd er rekening mee dat de XAML-parser voor het parseren van de XAML-definitie van een besturingselement op een pagina toegang moet hebben tot de code waarmee het besturingselement wordt geïmplementeerd en de eigenschappen ervan worden gedefinieerd. De besturingselementen die beschikbaar zijn voor een .NET MAUI-pagina worden geïmplementeerd in een verzameling assembly's die zijn geïnstalleerd als onderdeel van het Microsoft.Maui NuGet-pakket. De besturingselementen bevinden zich in een .NET-naamruimte in deze assembly's. In C#-code brengt u een naamruimte binnen het bereik met de using instructie. Op een XAML-pagina verwijst u naar een naamruimte met het xmlns kenmerk van de pagina. De volgende code toont de naamruimten die de XAML-pagina die in de vorige les is gemaakt:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             ...>

    ...
</ContentPage>

De eerste naamruimte, http://schemas.microsoft.com/dotnet/2021/mauiis de standaardnaamruimte van de pagina. Deze URI-vorm van naamruimte is typisch voor XML en ziet er iets anders uit dan die waarmee u mogelijk bekend bent in C#. Deze URI is echter gewoon een alias voor een of meer van de naamruimten die zijn gedefinieerd door de assembly's in het Microsoft.Tenant NuGet-pakket, dus als u deze naamruimte aan het begin van de pagina opgeeft, worden alle .NETtypen en -besturingselementen binnen het bereik gebracht. Als u deze naamruimte weglaat, kunt u geen besturingselementen zoals Button, Labelof EntryStackLayout.

De tweede naamruimte, http://schemas.microsoft.com/winfx/2009/xamlverwijst naar de assembly's die de verschillende intrinsieke .NET-typen bevatten, zoals tekenreeksen, numerieke gegevens en eigenschappen. In de voorgaande XAML-code wordt aan deze naamruimte de alias x toegewezen. In de XAML-code voor deze pagina verwijst u naar de typen in deze naamruimte door ze vooraf te laten gaan met x:. Elke XAML-pagina wordt bijvoorbeeld gecompileerd in een klasse en u geeft de naam op van de klasse die wordt gegenereerd met het kenmerk x:Class van de pagina:

<ContentPage ...
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MauiXaml.Page1"
            ...>

    ...
</ContentPage>

U kunt verwijzen naar typen in uw eigen assembly's in XAML-code via een XAML-naamruimte. Als u bijvoorbeeld typen en methoden hebt die u wilt gebruiken in uw XAML-code die is gedefinieerd in een naamruimte met de naamUtils in uw project, kunt u de Utils-naamruimte toevoegen aan de pagina, zoals wordt weergegeven in de volgende code. In dit voorbeeld opent u de typen in deze naamruimte door deze vooraf te laten gaan met de alias mycode.

<ContentPage ...
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:mycode="clr-namespace:Utils"
            ...>

    ...
</ContentPage>

Notitie

Verderop in deze module ziet u meer voorbeelden van deze techniek.

Eigenschapswaarden opgeven in XAML

In XML gebruikt u kenmerken om informatie over een element te beschrijven of op te geven. In XAML gebruikt u kenmerken om eigenschappen in te stellen voor het onderliggende type. Denk bijvoorbeeld aan de volgende C#-code:

var label = new Label { Text = "Username", TextColor = Color.Black };

Met deze instructie maakt u een nieuw Label object en stelt u de Text en TextColor eigenschappen in. Als u eigenschappen in XAML wilt instellen, gebruikt u kenmerken. De bijbehorende XAML-code ziet er als volgt uit:

<Label Text="Username" TextColor="Black" />

Een ding dat u misschien ziet, is anders in de XAML-code dan de C#-code de eigenschapswaarden. In de C#-code gebruikt u bijvoorbeeld het Color type voor de TextColor eigenschap. In de XAML-definitie stelt TextColor u echter een tekenreekswaarde in. Dit komt doordat een tekenreeks het enige geldige element is dat u kunt gebruiken voor een XML-kenmerkwaarde. Daarom moet er een manier zijn om elke tekenreekswaarde te converteren naar het juiste type. In XAML kunt u deze conversie uitvoeren met behulp van een typeconversieprogramma.

Wat is een typeconversieprogramma?

Een typeconversieprogramma converteert een XML-kenmerk dat is opgegeven als een tekenreekswaarde naar het juiste type. Bekijk het volgende voorbeeld om dit concept beter te begrijpen:

<Label Text="Username" TextColor="Black" FontSize="42" FontAttributes="Bold,Italic" />

Met deze code maakt u een Label en stelt u de Texteigenschappen in TextColorFontSizeFontAttributes en stelt u deze in.

Begin met de eerste eigenschap, Text. De tekst is al een tekenreeks, wat betekent dat de XAML-pagina geen typeconversieprogramma nodig heeft. TextColor Vervolgens wordt het Color type gebruikt, dus voor XAML is een typeconversieprogramma vereist om de tekenreeks te vertalen naar de bijbehorende Color waarde. De FontSize eigenschap is een geheel getal, dus XAML vereist een typeconversieprogramma om de tekenreeks te parseren op een geheel getal. Ten slotte FontAttributes is dit een voorbeeld van een complex object. U kunt de waarden combineren als een door komma's gescheiden tekenreeks: 'Vet, Cursief'. De door komma's gescheiden tekenreeks wordt behandeld als een opsomming op basis van [Vlaggen]en het juiste typeconversieprogramma past de bitwise OR van de waarde toe op de eigenschap.

.NET MAUI heeft typeconversieprogramma's voor de meeste ingebouwde klassen en gebruikt deze type conversieprogramma's automatisch. Als er echter geen specifiek conversieprogramma bestaat, kunt u uw eigen conversieprogramma schrijven en koppelen aan uw type om het bruikbaar te maken in XAML.

Complexe typetoewijzing

Typeconversieprogramma's zijn ideaal voor eenvoudige eigenschapsinstellingen; In sommige gevallen moet u echter een volledig object met eigen eigenschapswaarden maken. De oplossing voor dit probleem is het wijzigen van de eigenschapstoewijzing voor het gebruik van een syntaxis op basis van elementen. Deze syntaxis wordt het formulier Eigenschapselement genoemd. Deze syntaxis omvat het verbreken van de eigenschapssetter in het bovenliggende en onderliggende formulier, waarbij de eigenschap wordt uitgedrukt in een elementtag van het formulier Type.PropertyName. Stel dat u een gebarenherkenning wilt toewijzen aan een label, zodat de app-gebruiker op het label kan tikken. De gebarenherkenning is een complex object met eigen eigenschappen. Deze eigenschappen moeten doorgaans worden toegewezen om de juiste functionaliteit te garanderen:

<TapGestureRecognizer NumberOfTapsRequired="2" />

Als u deze waarde wilt toewijzen aan een Label, kunt u de XAML als volgt schrijven:

<Label Text="Username" TextColor="Black" FontSize="42" FontAttributes="Bold,Italic">
    <Label.GestureRecognizers>
        <TapGestureRecognizer NumberOfTapsRequired="2" />
    </Label.GestureRecognizers>
</Label>

Het Label type heeft een eigenschap met de naam GestureRecognizers. Met behulp van het formulier Eigenschapselement kunt u een toevoegen TapGestureRecognizer aan de lijst met gebaren voor de Label.

Standaardinhoudseigenschap

Sommige .NET MAUI-besturingselementen hebben een standaardeigenschap voor inhoud. Met de inhoudseigenschap kunt u de waarde van een eigenschap in een besturingselement opgeven zonder deze expliciet op te geven in XAML. Bekijk het volgende XAML-fragment:

<VerticalStackLayout>
    <VerticalStackLayout.Children>
        <Label Text="Please log in" />
    </VerticalStackLayout.Children>
</VerticalStackLayout>

Met deze code maakt u een VerticalStackLayout en voegt u een Label als onderliggend element toe. Omdat het gebruikelijk is om onderliggende items toe te voegen aan een VerticalStackLayout, Children is de eigenschap ervan de standaardeigenschap voor inhoud. Dit betekent dat u een kind kunt toevoegen zonder expliciet de Children, als volgt op te geven:

<VerticalStackLayout>
    <Label Text="Please log in" />
</VerticalStackLayout>

Kenniscontrole

1.

Wat doet een Type Converter?

Een typeconversieprogramma converteert de XAML-beschrijving van een pagina naar de equivalente C#-code.

Een typeconversieprogramma kan C#-code converteren naar de XAML-weergave van een pagina.

Een typeconversieprogramma wordt gebruikt om een XML-kenmerkwaarde te converteren die is opgegeven als een tekenreeks naar het juiste type.

2.

Hoe brengt u uw eigen aangepaste typen binnen het bereik in een XAML-bestand?

Gebruik het xmlns kenmerk van de pagina en geef de naamruimte die uw aangepaste typen bevat een alias waarnaar u kunt verwijzen vanuit de XAML-besturingselementen op de pagina.

Voeg een C# using -instructie toe aan het XAML-bestand.

Pas het x:FieldModifier kenmerk naamruimte toe op benoemde XAML-elementen.

U moet alle vragen beantwoorden voordat uw werk kan worden gecontroleerd.