XAML - style

Struktura XAML udostępnia kilka strategii personalizowania i dostosowywania wyglądu aplikacji. Style zapewniają nam elastyczność w ustawianiu niektórych właściwości obiektu i ponownym użyciu tych konkretnych ustawień w wielu obiektach w celu uzyskania spójnego wyglądu.

  • W stylach można ustawić tylko istniejące właściwości obiektu, takie jak wysokość, szerokość i rozmiar czcionki.

  • Można określić tylko domyślne zachowanie formantu.

  • Do jednego stylu można dodać wiele właściwości.

Style służą do nadania jednolitego wyglądu zestawowi kontrolek. Niejawne style służą do stosowania wyglądu do wszystkich kontrolek danego typu i upraszczają aplikację.

Wyobraź sobie, że mamy trzy przyciski i wszystkie muszą wyglądać tak samo - taka sama szerokość i wysokość, ten sam rozmiar czcionki i ten sam kolor pierwszego planu. Możemy ustawić wszystkie te właściwości na samych elementach przycisków i nadal jest to całkiem w porządku dla wszystkich przycisków, jak pokazano na poniższym diagramie.

Jednak w prawdziwej aplikacji zazwyczaj jest ich znacznie więcej, które muszą wyglądać dokładnie tak samo. Oczywiście nie tylko przyciski, ale zazwyczaj chcesz, aby bloki tekstowe, pola tekstowe i pola kombi itp. Wyglądały tak samo w całej aplikacji. Z pewnością musi istnieć lepszy sposób na osiągnięcie tego - jest znany jakostyling. Można myśleć o stylu jako wygodnym sposobie zastosowania zestawu wartości właściwości do więcej niż jednego elementu, jak pokazano na poniższym diagramie.

Spójrzmy na przykład, który zawiera trzy przyciski utworzone w języku XAML z pewnymi właściwościami.

<Window x:Class = "XAMLStyle.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   xmlns:d = "http://schemas.microsoft.com/expression/blend/2008" 
   xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006"
   xmlns:local = "clr-namespace:XAMLStyle" mc:Ignorable = "d" 
   Title = "MainWindow" Height = "350" Width = "604"> 
	
   <StackPanel> 
      <Button Content = "Button1" Height = "30" Width = "80" Foreground = "Blue" 
         FontSize = "12" Margin = "10"/>
      
      <Button Content = "Button2" Height = "30" Width = "80" Foreground = "Blue" 
         FontSize = "12" Margin = "10"/>
      
      <Button Content = "Button3" Height = "30" Width = "80" Foreground = "Blue" 
         FontSize = "12" Margin = "10"/> 
   </StackPanel> 
	
</Window>

Kiedy spojrzysz na powyższy kod, zobaczysz, że dla wszystkich przycisków wysokość, szerokość, kolor pierwszego planu, rozmiar czcionki i właściwości marginesów pozostają takie same. Gdy powyższy kod zostanie skompilowany i wykonany, wyświetli następujące dane wyjściowe -

Teraz spójrzmy na ten sam przykład, ale tym razem będziemy używać style.

<Window x:Class = "XAMLStyle.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   xmlns:d = "http://schemas.microsoft.com/expression/blend/2008" 
   xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006"
   xmlns:local = "clr-namespace:XAMLStyle" mc:Ignorable = "d" 
   Title = "MainWindow" Height = "350" Width = "604">
	
   <Window.Resources> 
      <Style x:Key = "myButtonStyle" TargetType = "Button">
         <Setter Property = "Height" Value = "30"/> 
         <Setter Property = "Width" Value = "80"/> 
         <Setter Property = "Foreground" Value = "Blue"/> 
         <Setter Property = "FontSize" Value = "12"/> 
         <Setter Property = "Margin" Value = "10"/> 
      </Style>
   </Window.Resources> 
	
   <StackPanel> 
      <Button Content = "Button1" Style = "{StaticResource myButtonStyle}"/>
      <Button Content = "Button2" Style = "{StaticResource myButtonStyle}"/>
      <Button Content = "Button3" Style = "{StaticResource myButtonStyle}"/>
   </StackPanel>
	
</Window>

Style są zdefiniowane w słowniku zasobów, a każdy styl ma unikalny identyfikator klucza i typ docelowy. Wewnątrz elementu <style> widać, że dla każdej właściwości, która zostanie uwzględniona w stylu, zdefiniowano wiele tagów ustawiających.

W powyższym przykładzie wszystkie wspólne właściwości każdego przycisku są teraz zdefiniowane w stylu, a następnie styl jest przypisywany do każdego przycisku z unikalnym kluczem przez ustawienie właściwości stylu za pomocą rozszerzenia znaczników StaticResource.

Kiedy powyższy kod zostanie skompilowany i wykonany, wygeneruje następujące okno, które jest tym samym wyjściem.

Zaleta zrobienia tego w ten sposób jest od razu oczywista. Możemy ponownie użyć tego stylu w dowolnym miejscu w jego zakresie, a jeśli musimy go zmienić, po prostu zmienimy go raz w definicji stylu zamiast w każdym elemencie.

Na jakim poziomie styl jest definiowany natychmiastowo ogranicza zakres tego stylu. Zatem zakres, tj. Gdzie możesz użyć stylu, zależy od tego, gdzie go zdefiniowałeś. Styl można zdefiniować na następujących poziomach -

Sr.No Poziomy i opis
1 Poziom kontroli

Zdefiniowanie stylu na poziomie kontroli można zastosować tylko do tej konkretnej kontrolki.

2 Poziom układu

Definiowanie stylu na dowolnym poziomie układu może być dostępne tylko dla tego układu i tylko jego elementów podrzędnych.

3 Poziom okna

Definiowanie stylu na poziomie okna może być dostępne dla wszystkich elementów w tym oknie.

4 Poziom aplikacji

Zdefiniowanie stylu na poziomie aplikacji sprawia, że ​​jest on dostępny w całej aplikacji.