Exercițiul: Utilizarea resurselor la nivel de aplicație

Finalizat

Scopul acestui exercițiu este de a face resursele disponibile pe mai multe pagini din aplicația dvs. .NET Multi-platform App UI (MAUI), mutându-le într-un dicționar de resurse din clasa Aplicației Calculator tip.

Acest exercițiu este o continuare a exercițiului anterior. Utilizați soluția existentă ca punct de plecare pentru acești pași sau deschideți proiectul TipCalculator în folderul exerciții4/TipCalculator din depozitul pe care l-ați clonat în primul exercițiu.

Verificarea resurselor la nivel de pagină

Să verificăm dacă resursele definite pe o pagină nu sunt disponibile pe altă pagină. La sfârșitul acestei secțiuni, aplicația dvs. nu rulează corect. Totuși, remediați problema în secțiunea următoare.

1. În proiectul tipCalculator, deschideți fișierul CustomTipPage.xaml.

2. Setați resursa infoLabelStyle ca stil pentru eticheta billLabel și eliminați setările existente pentru proprietățile FontSize și FontAttributes.

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

3. Rulați aplicația.

4. Selectați Utilizați Calculator particularizat pentru a afișa pagina CustomTipPage. Uită-te la eticheta Bill. Dimensiunea fontului ar trebui să fie mai mică decât celelalte etichete și nu este aldină. Acest comportament se datorează faptului că pagina nu a găsit o resursă numită infoLabelStyle (se află în dicționarul de resurse pentru o altă pagină), deci valorile implicite sunt utilizate pentru dimensiunea fontului și atributele fontului.

   

Crearea unui dicționar pentru resurse la nivel de aplicație

Să creăm un dicționar de resurse la nivel de aplicație pentru ca resursele să fie utilizate pe mai multe pagini.

1. Deschideți fișierul App.xaml. Observați că acest fișier conține în prezent un dicționar de resurse cu unele dicționare și stiluri de resurse existente care sunt utilizate în mod implicit pentru controalele încorporate în .NET MAUI. Pentru a vedea toate stilurile incluse în mod implicit, vizualizați fișierul 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. Deschideți fișierul StandardTipPage.xaml și mutați fontSize resursă și baseLabelStyle și infoLabelStyle stiluri în dicționarul de resurse din fișierul App.xaml. Plasați-le după stilurile existente, astfel încât fișierul App.Xaml să arate ca următorul exemplu:

   <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. Rulați aplicația.

4. Selectați Utilizați fila calculator particularizat și verificați dacă eticheta Factură este acum stilată corect.