WPF - Öğeler Ağacı

Programcıların nesneyi kolayca idare edebilmesi ve bir uygulamanın davranışını değiştirebilmesi için öğelerin ve bileşenlerin bir ağaç yapısında sıralandığı birçok teknoloji vardır. Windows Presentation Foundation (WPF), nesneler biçiminde kapsamlı bir ağaç yapısına sahiptir. WPF'de, eksiksiz bir nesne ağacının kavramsallaştırılmasının iki yolu vardır -

Mantıksal Ağaç Yapısı
Görsel Ağaç Yapısı

Bu ağaç yapılarının yardımıyla, UI öğeleri arasındaki ilişkiyi kolayca oluşturabilir ve tanımlayabilirsiniz. Çoğunlukla, WPF geliştiricileri ve tasarımcıları bir uygulama oluşturmak için yordamsal dili kullanır veya XAML'de uygulamanın UI bölümünü nesne ağacı yapısını akılda tutarak tasarlar.

Mantıksal Ağaç Yapısı

WPF uygulamalarında, XAML'deki UI öğelerinin yapısı mantıksal ağaç yapısını temsil eder. XAML'de, kullanıcı arabiriminin temel öğeleri geliştirici tarafından bildirilir. WPF'deki mantıksal ağaç aşağıdakileri tanımlar -

Bağımlılık özellikleri
Statik ve dinamik kaynaklar
Öğeleri kendi adına bağlamak vb.

Bir düğme ve liste kutusunun oluşturulduğu aşağıdaki örneğe bir göz atalım.

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

XAML koduna bakarsanız, bir ağaç yapısı göreceksiniz, yani kök düğüm Pencere'dir ve kök düğümün içinde yalnızca bir çocuk var, yani StackPanel. Ancak StackPanel, düğme ve liste kutusu olmak üzere iki alt öğe içerir. Liste kutusunda üç tane daha alt liste kutusu öğesi vardır.

Görsel Ağaç Yapısı

WPF'de görsel ağaç kavramı, Görsel Temel Sınıfı tarafından temsil edildiği şekliyle görsel nesnelerin yapısını açıklar. Çıktı ekranına işlenen tüm UI öğelerini belirtir.

Bir programcı belirli bir kontrol için bir şablon oluşturmak istediğinde, aslında o kontrolün görsel ağacını oluşturur. Görsel ağaç, performans ve optimizasyon nedenleriyle daha düşük seviye kontroller çizmek isteyenler için de çok kullanışlıdır.

WPF uygulamalarında görsel ağaç şu amaçlarla kullanılır:

Görsel nesnelerin işlenmesi.
Düzenleri işlemek.
Yönlendirilen olaylar çoğunlukla mantıksal ağaç boyunca değil, görsel ağaç boyunca ilerler.

Yukarıdaki basit uygulamanın bir buton ve bir liste kutusu içeren görsel ağacını görmek için XAML kodunu derleyip çalıştıralım ve aşağıdaki pencereyi göreceksiniz.

Uygulama çalışırken, aşağıda gösterildiği gibi, bu uygulamanın tüm hiyerarşisini gösteren Canlı Görsel Ağaç penceresinde çalışan uygulamanın görsel ağacını görebilirsiniz.

Görsel ağaç tipik olarak mantıksal ağacın bir üst kümesidir. Burada tüm mantıksal unsurların görsel ağaçta da mevcut olduğunu görebilirsiniz. Yani bu iki ağaç, kullanıcı arayüzünü oluşturan aynı nesne setinin gerçekten sadece iki farklı görünümüdür.

Mantıksal ağaç, kullanıcı arayüzünün temel yapısına odaklanmanızı ve tam olarak nasıl sunulduğunun ayrıntılarını görmezden gelmenizi sağlayan birçok ayrıntıyı dışarıda bırakır.
Mantıksal ağaç, kullanıcı arayüzünün temel yapısını oluşturmak için kullandığınız şeydir.
Sunuma odaklanıyorsanız, görsel ağaç ilginizi çekecektir. Örneğin, herhangi bir UI öğesinin görünümünü özelleştirmek isterseniz, görsel ağacı kullanmanız gerekecektir.