Resources definiëren en gebruiken

5 minuten

Een resource is als een symbolische constante uit een programmeertaal. U definieert deze op één plaats en verwijst ernaar overal waar u deze nodig hebt. Uw code is gemakkelijker te lezen omdat u een beschrijvende naam gebruikt in plaats van een 'magic'-waarde. Als u de waarde wilt wijzigen, hoeft u alleen de definitie bij te werken.

In deze module ziet u hoe u resources gebruikt om in code vastgelegde waarden te elimineren uit de Extensible Application Markup Language (XAML) die u gebruikt in de GEBRUIKERSinterface van .NET Multi-Platform App UI (TENANT).

Wat is een resource?

Een resource is elk object dat kan worden gedeeld in uw gebruikersinterface. De meest voorkomende voorbeelden zijn lettertypen, kleuren en grootten. U kunt echter ook complexe objecten, zoals Style en OnPlatform-exemplaren , opslaan als resources.

U definieert een resource in XAML of code. Vervolgens past u deze toe in XAML of code. Normaal gesproken werkt u volledig in XAML, hoewel we u later een paar gevallen laten zien waarin code nuttig is.

Bekijk een voorbeeld. Stel dat u dezelfde TextColor-waarden wilt gebruiken voor de besturingselementen op een pagina. Als u in code vastgelegde waarden hebt gebruikt, ziet uw XAML er als volgt uit. U ziet hoe de waarde voor de tekstkleur in de twee besturingselementen wordt herhaald.

<Label TextColor="Blue" FontSize="14">
<Button TextColor="Blue" FontSize="14">

In plaats van de tekstkleur te herhalen, kunt u deze definiëren als een resource. De definitie ziet er als volgt uit:

<Color x:Key="PageControlTextColor">Blue</Color>

U ziet hoe het gedefinieerde element een eigenschap x:Key heeft waarmee de resource een naam krijgt. U gebruikt deze sleutel om de resource in uw XAML op te zoeken.

Voordat u een resource kunt gebruiken, moet u deze opslaan in een resourcewoordenlijst.

Wat is ResourceDictionary?

ResourceDictionary is een .NET MAUI-bibliotheekklasse die is aangepast voor gebruik met UI-resources. Het is een woordenlijst, dus worden sleutel-waardeparen opgeslagen. Het type sleutel is beperkt tot Tekenreeks, terwijl de waarde elk object kan zijn.

Elke .NET MAUI XAML-pagina heeft een eigenschap met de naam Resources die een ResourceDictionary-object kan bevatten. De eigenschap is standaard null, dus u moet een woordenlijstexemplaren maken voordat u deze kunt gebruiken. De volgende code laat zien hoe u een ResourceDictionary-object maakt en dit toewijst aan de eigenschap Resources van een ContentPage:

<ContentPage.Resources>
    <ResourceDictionary>
        ...
    </ResourceDictionary>
</ContentPage.Resources>

.NET MAUI XAML heeft een ingebouwde syntaxis voor gemak waarmee het woordenlijstexemplaren automatisch worden gemaakt wanneer u de eigenschap Resources gaat gebruiken. Het vorige voorbeeld kan worden vereenvoudigd tot de volgende code:

<ContentPage.Resources>
    ...
</ContentPage.Resources>

Elke pagina in uw app kan een eigen woordenlijst hebben. U gebruikt deze paginaspecifieke woordenlijsten om resources op te slaan die uitsluitend op die pagina worden gebruikt.

Notitie

Elk besturingselement op een pagina kan ook een eigen resourcewoordenlijst hebben. U kunt bijvoorbeeld een resourcewoordenlijst toevoegen aan een label besturingselement als volgt:

<Label Text="Hello, World!"
        ...
        <Label.Resources>
           ...
        </Label.Resources>
</Label>

Naast indelingen en weergaven, die onderliggende elementen kunnen bevatten, is het niet gebruikelijk om een resourcewoordenlijst toe te voegen op het niveau van het besturingselement.

Een resource maken

Als u een resource wilt maken, declareert u deze in de eigenschap Resources voor een pagina. In het volgende voorbeeld wordt de tekstkleurresource gemaakt die eerder is beschreven

<ContentPage.Resources>
    <Color x:Key="PageControlTextColor">Blue</Color>
</ContentPage.Resources>

Wanneer u een sleutel voor uw resource selecteert, kiest u een naam die het gebruik weerspiegelt in plaats van de waarde van de resource. Als u bijvoorbeeld de achtergrond van een label wilt instellen op Rood, gebruikt u RedColor niet als sleutel, gebruikt u In plaats daarvan BackgroundColor.

Een resource toepassen met behulp van StaticResource

StaticResource is een markeringsextensie voor het opzoeken van resources in een resourcewoordenlijst. U geeft de sleutel van de resource op en de markeringsextensie retourneert de bijbehorende waarde. In de volgende XAML-markering ziet u een voorbeeld waarin een Color resource met de naam PageControlTextColor wordt gemaakt en gebruikt. De XAML-markering voor het labelbesturingselement in het voorbeeld maakt gebruik van de staticResource-markeringsextensie om de waarde op te halen.

<ContentPage.Resources>
    <Color x:Key="PageControlTextColor">Blue</Color>
</ContentPage.Resources>

...

<Label TextColor="{StaticResource PageControlTextColor}" ... />

De extensie wordt StaticResource genoemd omdat de extensie slechts één keer wordt geëvalueerd. Het opzoeken van de woordenlijst vindt plaats wanneer het doelobject wordt gemaakt. De doeleigenschap wordt niet bijgewerkt als de resourcewaarde in de woordenlijst verandert.

Waarschuwing

StaticResource genereert een runtime-uitzondering als de sleutel niet wordt gevonden.

XAML-intrinsieke typen

In het oorspronkelijke voorbeeld dat aan het begin van deze les wordt weergegeven, wordt de eigenschap TextColor en de eigenschap FontSize ingesteld:

<Label TextColor="Blue" FontSize="14">
<Button TextColor="Blue" FontSize="14">

De eigenschap FontSize heeft het type Double. Als u een resource voor deze waarde wilt maken, gebruikt u een van de intrinsieke XAML-typen die zijn gedefinieerd in de XAML-specificatie. De XAML-specificatie definieert typenamen voor veel van de eenvoudige C#-typen. De volgende code toont voorbeeldbronnen voor elk van de intrinsieke typen.

<ContentPage.Resources>
    <x:String x:Key="...">Hello</x:String>
    <x:Char x:Key="...">X</x:Char>
    <x:Single x:Key="...">31.4</x:Single>
    <x:Double x:Key="...">27.1</x:Double>
    <x:Byte x:Key="...">8</x:Byte>
    <x:Int16 x:Key="...">16</x:Int16>
    <x:Int32 x:Key="...">32</x:Int32>
    <x:Int64 x:Key="...">64</x:Int64>
    <x:Decimal x:Key="...">12345</x:Decimal>
    <x:TimeSpan x:Key="...">1.23:5959</x:TimeSpan>
    <x:Boolean x:Key="...">True</x:Boolean>
</ContentPage.Resources>

Platformspecifieke waarden instellen voor een resource

Het is gebruikelijk om de gebruikersinterface van uw app iets tussen platforms aan te passen. De standaardmethode om de platformspecifieke waarden te definiëren, is door een OnPlatform-object te gebruiken wanneer u een resource definieert. De volgende code laat bijvoorbeeld zien hoe u een resource maakt die verwijst naar verschillende tekstkleuren op iOS, Android, macOS (Mac Catalyst) en Windows (WinUI).

<ContentPage.Resources>
    <OnPlatform x:Key="textColor" x:TypeArguments="Color">
        <On Platform="iOS" Value="Silver" />
        <On Platform="Android" Value="Green" />
        <On Platform="WinUI" Value="Yellow" />
        <On Platform="MacCatalyst" Value="Pink" />
    </OnPlatform> 
</ContentPage.Resources>
...

<Label TextColor="{StaticResource textColor}" ... />