WPF - Drzewo elementów

Istnieje wiele technologii, w których elementy i komponenty są uporządkowane w strukturze drzewa, dzięki czemu programiści mogą łatwo obsługiwać obiekt i zmieniać zachowanie aplikacji. Windows Presentation Foundation (WPF) ma kompleksową strukturę drzewa w postaci obiektów. W WPF istnieją dwa sposoby konceptualizacji pełnego drzewa obiektów -

Struktura drzewa logicznego
Struktura drzewa wizualnego

Za pomocą tych struktur drzewiastych można łatwo tworzyć i identyfikować relacje między elementami interfejsu użytkownika. Przeważnie deweloperzy i projektanci WPF używają języka proceduralnego do tworzenia aplikacji lub projektują część interfejsu użytkownika aplikacji w języku XAML, pamiętając o strukturze drzewa obiektów.

Struktura drzewa logicznego

W aplikacjach WPF struktura elementów interfejsu użytkownika w języku XAML reprezentuje logiczną strukturę drzewa. W języku XAML podstawowe elementy interfejsu użytkownika są deklarowane przez dewelopera. Drzewo logiczne w WPF definiuje następujące -

Właściwości zależności
Zasoby statyczne i dynamiczne
Wiązanie elementów w nazwie itp.

Spójrzmy na poniższy przykład, w którym tworzony jest przycisk i pole listy.

<Window x:Class = "WPFElementsTree.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
   Title = "MainWindow" Height = "350" Width = "604"> 
	
   <StackPanel> 
      <Button x:Name = "button" Height = "30" Width = "70" Content = "OK" Margin = "20" /> 
		
      <ListBox x:Name = "listBox" Height = "100" Width = "100" Margin = "20"> 
         <ListBoxItem Content = "Item 1" /> 
         <ListBoxItem Content = "Item 2" /> 
         <ListBoxItem Content = "Item 3" /> 
      </ListBox> 
		
   </StackPanel> 
	
</Window>

Jeśli spojrzysz na kod XAML, zobaczysz strukturę drzewa, tj. Węzeł główny to okno, a wewnątrz węzła głównego jest tylko jedno dziecko, czyli StackPanel. Ale StackPanel zawiera dwa elementy podrzędne, przycisk i pole listy. Pole listy ma jeszcze trzy podrzędne elementy listy.

Struktura drzewa wizualnego

W WPF koncepcja drzewa wizualnego opisuje strukturę obiektów wizualnych reprezentowaną przez klasę Visual Base. Oznacza wszystkie elementy interfejsu użytkownika, które są renderowane na ekranie wyjściowym.

Gdy programista chce utworzyć szablon dla określonej kontrolki, w rzeczywistości renderuje wizualne drzewo tej kontrolki. Drzewo wizualne jest również bardzo przydatne dla tych, którzy chcą rysować kontrolki niższego poziomu ze względu na wydajność i optymalizację.

W aplikacjach WPF drzewo wizualne jest używane dla -

Renderowanie obiektów wizualnych.
Renderowanie układów.
Zdarzenia kierowane przeważnie wędrują wzdłuż drzewa wizualnego, a nie logicznego.

Aby zobaczyć drzewo wizualne powyższej prostej aplikacji, która zawiera przycisk i pole listy, skompilujmy i uruchom kod XAML, a zobaczysz następujące okno.

Gdy aplikacja jest uruchomiona, możesz zobaczyć wizualne drzewo uruchomionej aplikacji w oknie Live Visual Tree, które pokazuje pełną hierarchię tej aplikacji, jak pokazano poniżej.

Drzewo wizualne jest zwykle nadzbiorem drzewa logicznego. Widać tutaj, że wszystkie elementy logiczne są również obecne w drzewie wizualnym. Tak więc te dwa drzewa to tak naprawdę tylko dwa różne widoki tego samego zestawu obiektów, które tworzą interfejs użytkownika.

Drzewo logiczne pomija wiele szczegółów, umożliwiając skupienie się na podstawowej strukturze interfejsu użytkownika i zignorowanie szczegółów dotyczących tego, jak został on przedstawiony.
Drzewo logiczne służy do tworzenia podstawowej struktury interfejsu użytkownika.
Drzewo wizualne będzie interesujące, jeśli koncentrujesz się na prezentacji. Na przykład, jeśli chcesz dostosować wygląd dowolnego elementu interfejsu użytkownika, będziesz musiał użyć drzewa wizualnego.