WPF’li Günler Layout KavramıMerhaba arkadaşlar, size bu yazımda her zaman ilgi duyduğum WPF (Windows Presentation Foundation)’de Layout kavramını anlatacağım.WPF çıkmadan önce WinForm Application’ larda düzen işlemleri yaparken sabit piksel koordinatlarıyla çalışıyorduk. Bir uygulamada işlemsellik ne kadar önemliyse görünüşte bir o kadar önemlidir. Bir uygulamanın ilk bakışta kullanıcıyı etkilemesi için user-friendly olmalıdır..Bu yüzden WPF’nin önemi burda birkez daha ön plana çıkmaktadır. WPF’in en önemli özelliklerinden biriside,bir uygulama farklı bilgisayarlarda farklı fontlarda farklı ekran çözünürlüklerinde çalıştırılsa bile görüntünün bozulmamasını sağlamasıdır. WPF ‘in zengin layouts katmanları sayesinde bu işlevselliğe çok kolay sahip olmaktayız.WPF’teki en çok kullanılan layout(düzen ) controllerine şöyle hızlı bir giriş yaparsak,Stack PanelDock PanelGrid PanelWrap PanelCanvas Panel diye sıralayabiliriz.Bu controlller aslında WindowsForm da container özelliğine benzemektedir. Bu panellerin en önemli ortak özelliği Panel isimli abstract sınıftan türetilmiş olmalarıdır. Windows Formda controlleri nasıl bir container üzerine yerleştiriyorsak buradada belli özellikleri var olan düzenleme yerleştirme şekli gibi farklı controllere yine controlleri yerleştiriyoruz.Panellerle birlikte bilinmesi gereken bazı pratik bilgileride panellere geçmeden aktarmak isterim.Panellerle gerçekten User-Friendly bir uygulama yapmak için birkaç noktaya dikkat etmek gerekir.-Kontrollerinize sabit büyüklükler vermekten kaçının. Aslında bu kural Web sayfası tasarlarkende geçerlidir.Kontrollerinizin Width ve Height degerlerini auto yapmanız sizin açınızdan kolaylık sağlayacaktır.-Kontrollerinize sabit koordinant vermekten kaçının.Alignment özelliklerini margin ile kullanmamanızda fayda var.-Butonların yazısını StackPanel ile hizalayın.-Statik veri giriş formlarını GidPanel ile düzenleyin.Dinamik labellar için büyüklüğü auto olan sütunlar textboxlar için ise star(*) olan sütunlar kullanın.Margin: Kontrol çevresinde diğer kontrollerle arasına bırakılan mesafedir.Gerçek hayattada böyle değilmidir herkesle mesafen olmalı hatta padding özelliği gibi kendi içinle bile..Padding:Bu özellikte ise kendi sınırları içinde bulunan kontrollere dış hizasına mesafe koyar.NOT:Bu paneller PresentationFramework ( PresentationFramework.dll) assembly’sinde yer alır.Kısa açıklamalardan sonra artık asıl konumuza panellerimizi bir bir tanımaya geçebiliriz.Wrappanel:Wrappanelin syntax yapısı aşagıdaki gibidir.Unutmayın margin değerlerini 0 yapmazsanız istediğiniz sonucu göremezsiniz.
Wrappanel’le kontrol kullanırken genellikle aynı büyüklüklerde kullanmanızda fayda var eğer farklı büyüklüklerde özellikle Height özelliği farklı olanlarda en yüksek olana göre dizilim yapıcaktır.Wrappanel aslında StackPanele de benzemektedir. Farkı tek satıra sığmayan elemanları yeni satıra atmasıdır.Default olarak Orientation’ı Horizontal olmaktadır ama Vertical olarak degiştirebilmektesiniz bunu.İsterseniz FlowDirection özelliklerini degiştirerek sağdan sola yada yukarıdan aşağıya yada bunların tam tersi düzende sıralayabilirsiniz.Hatta çirkin görüntüler elde etmek istemiyorsanızda ItemHeight ve ItemWidth özelliklere değer vererek child node ların aynı büyüklüklerde olmasını sağlayabilirsiniz.StackPanel:Stackpanelde Wrappanele benzemektedir.Wrappaneldeki gibi child elementlerini tek satıra yada dikey hizaya sıralamaktadır.Fakat farkı Satır sonunda wrap işlemi yapmamakta yani alt satıra geçmemektedir.
Syntax yapısı bu şekildedir.Default olarak Orientation özelliği Vertical gelir.Bunu yine ihitiyacımıza göre horizontal yapabiliriz.Satır sonuna gelindiğinde sıralanacak eleman StackPanelin etki alanı dışına çıkar ve hiçbir panelde yer almıyomuş gibi yada bir üst parent’in üyesi gibi davranır.
Syntax yapısına baktığımızda diğer panellere çok benzemekte fakat farkı burada child elementlere DockPanel.Dock gibi özellik gelmektedir.Bu özelliğe Left,Right,Top,Bottom gibi Değerler vererek Kontrollerimizi yerleştirebiliriz.Bu panelde dikka etmemiz gereken nokta ise yukarıdaki kod bloğunda gördüğünüz gibi son Dockpanel içindeki son elemanda DockPanel.Dock özelliği yoktur.Son elemanı LastChildFill=”True” özelliği ile Panelin ortasını kapsayacak şekilde yerleştiriyoruz eğer bu özellik false olsaydı DockPanel Default Dock özelliği left olduğundan sola dayalı şekilde olurdu.Grid Panel:Grid Panel kontrolu aslında HTML table elementine benzemektedir fakat daha esnek ve fonksiyonel yapıdadır.
Burada
Bu kod Bloğunda Grid panelinin Satır bilgilerini veriyoruz . Her RowDefiniton bloğu tek satır için bilgi vermektedir. RowDefinitions Collection Nesnesidir.
Bu kod bloğundada aynen Her sütun için gerekli bilgiler verilmektedir.Bu Grid için biz 3 satır 2 kolon olacak şekilde bir tablo tasarımı yaptık.Daha sonraki satırlardaki kontorllerde Grid.Row=”0″ Grid.Column=”0″ gibi özelliklerle kontrollere kaçınçı satır kaçıncı sütunda olacağını işaretliyoruz.Canvas Panel:Bu panele daha çok grafiksel işlemlerde çizgi,elips dikdörtgen gibi sekiller çizerken yada bu tür işlemler yaparken ihtiyaç duyarız.Yerleştirilme işlemi bu panel içinde Left,Right,Top,Bottom özelliklerine göre panelin kenar uzaklıklarına ayarlanır.
Canvas Panelin syntax yapısıda yukarıdaki kod bloğu şeklindedir.Buradada Attached Property ler kullanılmıştır. Canvas.Left=”144″ && Canvas.Top=”126″ Attached Property’lerindeki button kontorlerine Yukarıdan soldan sağdan margin tarzı uzaklık değerleri vermekteyiz.Uygulamamızın çıktısında görüldüğü gibi ortadaki butonlar birbiri üzerine geçmiştir.Fakat uygulamamızda altta kalan butona Panel sınıfının özelliği olan Panel.ZIndex=”1″ gibi bir özellik set edersek aşağıdaki görüntüyü elde ederiz.Mavi buton bu sefer üsttedir.Sizlere Layout in WPF(WPF’de düzenler) hakkında şimdilik söyleyebileceklerim bunlar.Umarım temel oluşturabilecek kadar anlatabilmişimdir.Bir başka WPF’li günde görüşmek üzere sağlıcakla kalın…NOT:Unutmadan şunuda bildirmek isterim.Bir WPF window Kontorülde tek panele izin vardır yani Window kontrolü tek panel içerir.Fakat elbetteki Panel içinde Panel kullanarak düzgün tasarımlar yapabiliriz.Tamamen sizin yaratıcılığınıza kalmıştır bu. Düzen hastası olanlar için iyi bir makaleydi diye düşünmekteyim.
