‫Tekrar hoş geldiniz.
‫Bu videoda, yığın, panel listesi, kutu, ardından mantıksal ağaç ve görsel ağaç hakkında konuşacağız.
‫Öncelikle bu ızgaradan kurtulalım çünkü henüz ızgaraya dokunmadık, dolayısıyla ızgarayı henüz doğru şekilde
‫kullanmadık ama sonraki videolardan birinde bunu yapacağız.
‫Bu yüzden ızgara yerine bir yığın paneli kullanmak istiyorum.
‫Yığın paneli, öğeleri üst üste yığmamı sağlar; böylece örneğin buraya bir metin bloğu
‫ekleyebilirim.
‫Ve metni basitçe şöyle yazacağım: Merhaba dünya, basit metin.
‫Ve gördüğünüz gibi, Hello World metnim var.
‫Şimdi de yapmak istediğim şey, yatay hizalama yapmak istiyorum, burada ortayı kullanacağım.
‫Şimdi burada görebileceğiniz gibi metni ortalıyorum.
‫Şimdi metin ortalanmıştır ve ayrıca her yöne doğru biraz kenar boşluğu vardır, bu da 20'dir.
‫Gördüğünüz gibi, bir kenar boşluğu kullanıyorum ve sadece 20 diyorum, bu da dört yöne doğru
‫20 piksellik bir kenar boşluğu oluşturacak.
‫Şimdi sıradaki şey bir liste kutusu ve nasıl göründüğünü görebilmeniz için bir liste kutusu kullanmak istiyorum.
‫Yani buradaki liste kutusu şu anda boş, ancak burada bir liste kutusu öğesi oluşturarak bunu kolayca değiştirebiliriz.
‫Şimdi devam edelim ve bir liste kutusu öğesi oluşturalım.
‫Ve bu öğe, diyelim ki içerik birinci öğeye eşit olacak şekilde içeriğe sahip olmalıdır.
‫Ve şimdi bir açılış ve kapanış etiketi yerine, sadece bu kısa versiyona sahip olmak istiyorum.
‫Bunu geçen yıl kullandım ve Visual Studio benim için otomatik olarak kapanış etiketinden kurtulacak kadar akıllı.
‫Şimdi bu liste kutusunda bir öğe var ve ben bunu birden çok kez kopyalayıp yapıştıracağım.
‫Bu yüzden birinci, ikinci ve üçüncü maddeyi alacağım.
‫Ve şimdi bu liste kutusu tüm genişliği kaplıyor.
‫Gördüğünüz gibi, tüm ebeveyni alır ve sadece gerektiği kadar yüksek veya yüksektir.
‫Yani sadece içindeki elemanların yükseklikleri kadar alan gerektiği anlamına gelir.
‫Diyelim ki bu birinci öğe ile ikinci ve üçüncü öğelerin her biri 30 piksel yüksekliğinde.
‫Yani tüm bu kutu sadece 90 piksel yüksekliğinde olacaktır.
‫Ancak bunu, diyelim ki yüksekliği ayarlayarak değiştirebiliriz.
‫Ve ben sadece 100'lük bir yükseklik kullanacağım.
‫Gördüğünüz gibi, nesne daha önce olduğundan daha yüksekte.
‫Şimdi de 100 piksellik bir genişlik oluşturalım.
‫Şimdi bu kutunun çok daha küçük olduğunu ve tam içine sığdığını görebilirsiniz.
‫Tamam.
‫Şimdi, tüm yönlere doğru bir kenar boşluğuna sahip olmak istersem, bu öğeye kenar boşluğu da verebilirim.
‫Ancak görebileceğiniz gibi, bu Helloworld metin bloğunun her yöne doğru 20 kenar boşluğu olduğundan,
‫buradaki iki liste öğesi arasında veya liste kutusu ile metin bloğu arasında da bir mesafe vardır.
‫Şimdi, bu kodu çalıştırırsak, güzel olan ve öğeleriyle birlikte liste kutumuzu içeren bu küçük
‫ana pencereye sahip olduğumuzu göreceğiz.
‫Burada gördüğünüz gibi, metin bloğuna merhaba dünya ve ardından bu liste öğeleri, üzerlerine tıklayabilir,
‫hatta gördüğünüz gibi onları seçebilirsiniz.
‫Ancak başka hiçbir şey olmuyor çünkü olayı henüz kontrol etmedik, bunu bir sonraki videoda yapacağız.
‫O yüzden bunu tekrar kapatacağım.
‫Şimdi de hızlıca mantıksal ve görsel ağaçtan bahsedelim.
‫Yani burada sahip olduğumuz şey mantıksal bir ağaçtır ya da mantıksal ağacı XAML'de görebiliriz.
‫Yani mantıksal ağaç, bu pencerenin içindeki bir penceredir.
‫Bir yığın panelimiz var.
‫Şu yığın panelinin içinde.
‫Bir metin kutusu bloğumuz ve bir liste kutumuz var.
‫Ve liste kutusu içinde, aslında liste kutumuz var, öğe bir liste kutusu öğe iki ve üç.
‫Yani mantıksal ağaç bu.
‫Hemen hemen birden fazla şubeniz var.
‫Gittikçe daha derine iniyor.
‫Yani pencerenin iki dalı olan yığın panelinin bir dalı vardır ve bunlardan biri Liste Kutusu'dur
‫ve bunun da dalları vardır.
‫Dediğim gibi, tekrar ediyorum, bu mantıksal bir ağaç.
‫Şimdi görsel ağaca bir göz atalım, çünkü örneğin buraya bir düğme eklersem ve birazdan bir
‫şey için buna ihtiyacım olacak.
‫Bu yüzden yeni bir düğme oluşturuyorum ve ona Click Me içeriğini veriyorum.
‫Ayrıca buraya, birisi tıkladığında çağrılacak bir yöntem ekleyeceğim.
‫Burada click kullanıyorum ve yeni bir olay işleyici oluşturuyorum.
‫Ve bu benim için Button Click adında yeni bir yöntem oluşturur.
‫Şimdi buraya bakarsanız, Button Click adında, E adında bir nesne göndericisi ve yönlendirilmiş olay argümanları
‫olan bir yöntem olduğunu görebiliriz.
‫Yani bunun yaptığı şey, bu yöntemin çağrılacak olmasıdır.
‫Düğmeye her tıkladığımızda ve bu yöntemin içinde ne varsa, gövde çalıştırılacaktır.
‫Diyelim ki henüz kullanmadığımız bir mesaj kutusu kullanıyoruz ve onun yöntemini show olarak adlandırıyoruz.
‫Basitçe bir kutu gösterebiliriz veya bir kutu küçük bir açılır pencere gibi görünecek ve bize bazı metinler gösterecektir.
‫Yani beni tıkladığınız için teşekkürler gibi bir şey ve metin beni tıklayın dedi ve bu şekilde ortaya çıkacak
‫metin.
‫Tıkladığınız için teşekkürler mesaj kutusu, beni tıkladığınız için teşekkürler gibi güzel bir şey gösterecektir.
‫Gördüğünüz gibi bu bana tıklayın düğmesi liste kutumuzun hemen altında.
‫Şimdi lütfen devam edin ve aralarına biraz mesafe ekleyin.
‫Tamam.
‫Umarım bunu yapmaya çalışırsın.
‫Düğmemize bir kenar boşluğu verebiliriz ve ben yine 20 kullanacağım ya da liste kutumuza bir kenar boşluğu
‫verebiliriz.
‫Ancak düğmeye bir kenar boşluğu vermek kesinlikle iyi olacaktır.
‫Şimdi kodu çalıştırırsak, burada bu güzel bana tıkla düğmesini elde edeceğiz.
‫Yani merhaba dünyamız var, metnimiz var ve benzeri ya da liste kutumuz var.
‫Ve şimdi Beni Tıkla'ya tıklarsak, bu mesaj kutusu açılır ve kontrol eder.
‫Beni tıkladığınız için teşekkürler gibi bir şey söyleyin ve mesaj kutusunu tekrar kapatmak için tamam'a tıklayabiliriz.
‫O zaman açalım.
‫Gördüğünüz gibi, beni tıkladığınız için teşekkür ederim.
‫Yani bu bir mesaj kutusudur ve bunu test amacıyla konsol uygulamalarımızda konsol sağ satırını
‫kullandığımıza benzer bir şekilde kullanabiliriz.
‫Yani bir olaydan sonra bir şey açmak istediğimizde, sadece bir mesaj kutusu açıyoruz, böylece biliyoruz
‫ki, tamam, harika çalıştı.
‫İşte düğme ve mantıksal üçümüz.
‫Şimdi görsel ağaca bir göz atalım.
‫Yani görsel ağacı elde etmek için birden fazla yol vardır.
‫Ancak benim kullanacağım, buraya bir nokta, bir hata ayıklama noktası ekleyeceğim.
‫Dolayısıyla, bu kod satırı her çalıştırıldığında hata ayıklamaya girecektir.
‫Şimdi kodu başlatayım ya da programımızı başlatayım.
‫Şimdi düğmeye tıklıyorum ve programımız duruyor ve hata ayıklama moduna geçiyoruz.
‫Ve sonra buradan WPF ağaç görselleştiricisine gidebilirim.
‫Şimdi yapacağım şey, buna tıklamak ve sağ üstte veya sağ tarafta bu özelliklere
‫sahip olan görsel ağacın bulunduğu WPF görselleştiricisini açmak.
‫Gördüğünüz gibi, örneğin düğmemiz veya liste kutumuz için çok sayıda özellik
‫var ve hatta bu özelliklerin tüm değerlerini bana söylüyor.
‫Ve biz bunların hiçbirini ayarlamadık bile.
‫Belki marj hariç.
‫Ama bunun dışında kurduğumuz bir şey yok.
‫Gördüğünüz gibi arka plan beyaz.
‫Bu her zaman iyidir.
‫Böylece bunu kodda da değiştirebiliriz.
‫Bu arada, şu anda burada önemli olan görsel ağacımızdır.
‫Burada da mantıksal ağacımızın bazı yönlerini görüyorsunuz.
‫Örneğin, ana pencereyi görebilirsiniz, sonra yığın panelini görürsünüz ve orada metin bloğu liste kutusunu
‫ve düğmeyi görürsünüz.
‫Ama çok daha fazlası var.
‫Gördüğünüz gibi, ana pencerenin mantıksal ağaçta görmediğimiz, ancak bireysel ağaçta gördüğümüz
‫bir kenarlığı var.
‫Ardından bir donör dekoratörü, içeriği gerçekten gösteren bir içerik sunucusu ve ardından Yığın
‫paneli vardır.
‫Yığın panelinde yine bir metin bloğu, kenarlığı olan bir liste kutusu ve bu kutunun bir kaydırma görünümü vardır.
‫Dolayısıyla, sahip olduğu yükseklikte gösterilemeyecek kadar çok öğe varsa, kaydırma özelliğine sahip olacaktır.
‫Sonra orada bir dikdörtgen içeren bir ızgara ve yığın panelini görselleştiren bir öğe sunucusuna sahip
‫bir kaydırma içeriği sunucusu vardır.
‫Ve sonra orada, yine bir içerik sunucusu olan bir kenarlığa sahip olan liste kutusu öğemizi buluyoruz.
‫Ve son olarak metin bloğunu bulabiliriz.
‫Gördüğünüz gibi burada çok uzun bir ağaç var, çok fazla dalı var.
‫Ancak sonuçta bulabileceğiniz şey, programınızda görsel olarak yer alan tüm farklı unsurlardır.
‫Genel olarak programınızda neyin temsil edildiği veya kullanıldığı ve programınıza neleri eklediğiniz hakkında daha fazla
‫bilgi edinmek istiyorsanız bu çok yararlı olabilir.
‫Ancak görsel ağaç hakkında her şeyi genellikle bu şekilde öğrenebilirsiniz.
‫Ve gördüğünüz gibi, liste kutumuzun içinde kendimiz kurmadığımız bir ızgaramız var, ama sadece
‫orada, değil mi?
‫Ve bu ızgaraya tıklarsanız, sağ tarafta bu ızgaranın özelliklerini de bulabilirsiniz.
‫Okeydokey.
‫Görsel ağaç ve mantıksal ağaç için aşağı yukarı bu kadardı.
‫Yığın paneli ve liste kutusu kullandık.
‫Gelecekte teknoloji panelini çok daha fazla kullanacağız.
‫Yani buna alışın.
‫Ve evet, bir sonraki videoda etkinliklere göz atacağız.
‫Orada görüşürüz.