WPF - Albero degli elementi

Esistono molte tecnologie in cui gli elementi e i componenti sono ordinati in una struttura ad albero in modo che i programmatori possano facilmente gestire l'oggetto e modificare il comportamento di un'applicazione. Windows Presentation Foundation (WPF) ha una struttura ad albero completa sotto forma di oggetti. In WPF, ci sono due modi per concettualizzare un albero di oggetti completo:

  • Struttura ad albero logica
  • Struttura ad albero visiva

Con l'aiuto di queste strutture ad albero, puoi facilmente creare e identificare la relazione tra gli elementi dell'interfaccia utente. Per lo più, gli sviluppatori e i designer di WPF usano il linguaggio procedurale per creare un'applicazione o progettare la parte dell'interfaccia utente dell'applicazione in XAML tenendo presente la struttura ad albero degli oggetti.

Struttura ad albero logica

Nelle applicazioni WPF, la struttura degli elementi dell'interfaccia utente in XAML rappresenta la struttura ad albero logica. In XAML, gli elementi di base dell'interfaccia utente vengono dichiarati dallo sviluppatore. L'albero logico in WPF definisce quanto segue:

  • Proprietà di dipendenza
  • Risorse statiche e dinamiche
  • Vincolare gli elementi sul suo nome ecc.

Diamo uno sguardo al seguente esempio in cui vengono creati un pulsante e una casella di riepilogo.

<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>

Se guardi il codice XAML, osserverai una struttura ad albero, ovvero il nodo radice è la finestra e all'interno del nodo radice c'è un solo figlio, ovvero StackPanel. Ma StackPanel contiene due elementi figlio, pulsante e casella di riepilogo. La casella di riepilogo ha altri tre elementi di casella di riepilogo figlio.

Struttura ad albero visiva

In WPF, il concetto di struttura ad albero visuale descrive la struttura degli oggetti visivi, rappresentata dalla classe Visual Base. Significa tutti gli elementi dell'interfaccia utente di cui viene eseguito il rendering nella schermata di output.

Quando un programmatore desidera creare un modello per un controllo particolare, in realtà esegue il rendering della struttura ad albero visuale di quel controllo. La struttura ad albero visuale è molto utile anche per chi vuole disegnare controlli di livello inferiore per motivi di prestazioni e ottimizzazione.

Nelle applicazioni WPF, la struttura ad albero visuale viene utilizzata per:

  • Rendering degli oggetti visivi.
  • Rendering dei layout.
  • Gli eventi indirizzati viaggiano principalmente lungo l'albero visivo, non l'albero logico.

Per vedere l'albero visivo della semplice applicazione sopra che contiene un pulsante e una casella di riepilogo, compiliamo ed eseguiamo il codice XAML e vedrai la finestra seguente.

Quando l'applicazione è in esecuzione, è possibile vedere l'albero visivo dell'applicazione in esecuzione nella finestra Albero visivo live che mostra la gerarchia completa di questa applicazione, come mostrato di seguito.

L'albero visuale è in genere un superset dell'albero logico. Puoi vedere qui che tutti gli elementi logici sono presenti anche nella struttura ad albero visuale. Quindi questi due alberi sono in realtà solo due visualizzazioni diverse dello stesso insieme di oggetti che compongono l'interfaccia utente.

  • L'albero logico tralascia molti dettagli consentendo di concentrarsi sulla struttura principale dell'interfaccia utente e di ignorare i dettagli di come è stata presentata esattamente.

  • L'albero logico è ciò che utilizzi per creare la struttura di base dell'interfaccia utente.

  • L'albero visivo sarà interessante se ti stai concentrando sulla presentazione. Ad esempio, se desideri personalizzare l'aspetto di qualsiasi elemento dell'interfaccia utente, dovrai utilizzare la struttura ad albero visuale.