Övning: Använda programomfattande resurser

Slutförd

Målet med den här övningen är att göra resurser tillgängliga på flera sidor i ditt MAUI-program (Multi-Platform App UI) genom att flytta dem till en resursordlista i klassen Tipskalkylatorprogram.

Den här övningen är en fortsättning på föregående övning. Använd antingen din befintliga lösning som utgångspunkt för de här stegen eller öppna TipCalculator-projektet i mappen exercise4/TipCalculator på lagringsplatsen som du klonade i den första övningen.

Verifiera resurser på sidnivå

Nu ska vi kontrollera att resurser som definierats på en sida inte är tillgängliga på en annan sida. I slutet av det här avsnittet körs inte appen korrekt. Du kan dock åtgärda det i nästa avsnitt.

1. I TipCalculator-projektet öppnar du filen CustomTipPage.xaml.

2. Ange infoLabelStyle-resursen som formatmall för etiketten billLabel och ta bort de befintliga inställningarna för egenskaperna FontSize och FontAttributes.

   <Label x:Name="billLabel" Text="Bill" Style="{StaticResource infoLabelStyle}" Grid.Row="0" Grid.Column="0" />
   

3. Kör appen.

4. Välj Använd anpassad kalkylator för att visa sidan CustomTipPage . Titta på fakturaetiketten. Teckenstorleken ska vara mindre än de andra etiketterna och den är inte fet. Det här beteendet beror på att sidan inte hittade någon resurs med namnet infoLabelStyle (den finns i resursordlistan för en annan sida), så standardvärdena används för teckensnittsstorleken och teckensnittsattributen.

   

Skapa en ordlista för resurser på programnivå

Nu ska vi skapa en programomfattande resursordlista för att lagra resurser som ska användas på flera sidor.

1. Öppna filen App.xaml. Observera att den här filen för närvarande innehåller en resursordlista med vissa befintliga resursordlistor och formatmallar som används som standard för kontroller som är inbyggda i .NET MAUI. Om du vill se alla formatmallar som ingår som standard kan du visa filen Resources/Styles.xaml .

   <?xml version = "1.0" encoding = "UTF-8" ?>
   <Application xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
                xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                xmlns:local="clr-namespace:TipCalculator"
                x:Class="TipCalculator.App">
       <Application.Resources>
           <ResourceDictionary>
               <ResourceDictionary.MergedDictionaries>
                   <ResourceDictionary Source="Resources/Colors.xaml" />
                   <ResourceDictionary Source="Resources/Styles.xaml" />
               </ResourceDictionary.MergedDictionaries>
           </ResourceDictionary>
       </Application.Resources>
   </Application>
   

2. Öppna filen StandardTipPage.xaml och flytta fontSize-resursenoch formatmallarna baseLabelStyle och infoLabelStyle till resursordlistan i Filen App.xaml. Placera dem efter de befintliga formatmallarna så att Filen App.Xaml ser ut som i följande exempel:

   <Application xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
                ...>
       <Application.Resources>
           <ResourceDictionary>
               <ResourceDictionary.MergedDictionaries>
                   <ResourceDictionary Source="Resources/Colors.xaml" />
                   <ResourceDictionary Source="Resources/Styles.xaml" />
               </ResourceDictionary.MergedDictionaries>
   
               <Color x:Key="bgColor">#C0C0C0</Color>
               <Color x:Key="fgColor">#0000AD</Color>
               <x:Double x:Key="fontSize">22</x:Double>
   
               <Style x:Key="baseLabelStyle" TargetType="Label">
                   <Setter Property="FontSize" Value="{StaticResource fontSize}" />
               </Style>
               <Style x:Key="infoLabelStyle" BasedOn="{StaticResource baseLabelStyle}" TargetType="Label">
                   <Setter Property="FontAttributes" Value="Bold" />
               </Style>
           </ResourceDictionary>
       </Application.Resources>
   </Application>
   

3. Kör appen.

4. Välj fliken Använd anpassad kalkylator och kontrollera att fakturaetiketten nu är korrekt formaterad.