XAML - Stiller
XAML çerçevesi, bir uygulamanın görünümünü kişiselleştirmek ve özelleştirmek için çeşitli stratejiler sağlar. Stiller bize bir nesnenin bazı özelliklerini belirleme ve bu belirli ayarları tutarlı bir görünüm için birden çok nesne arasında yeniden kullanma esnekliği sağlar.
Stillerde, bir nesnenin Yükseklik, Genişlik ve Yazı tipi boyutu gibi yalnızca mevcut özelliklerini ayarlayabilirsiniz.
Bir kontrolün yalnızca varsayılan davranışı belirlenebilir.
Tek bir stile birden çok özellik eklenebilir.
Stiller, bir dizi kontrole tek tip bir görünüm vermek için kullanılır. Örtük Stiller, belirli bir türdeki tüm denetimlere bir görünüm uygulamak ve uygulamayı basitleştirmek için kullanılır.
Üç düğmemiz olduğunu ve hepsinin aynı görünmesi gerektiğini düşünün - aynı genişlik ve yükseklik, aynı yazı tipi boyutu ve aynı ön plan rengi. Tüm bu özellikleri düğme öğelerinin kendisinde ayarlayabiliriz ve bu, aşağıdaki şemada gösterildiği gibi tüm düğmeler için hala oldukça uygundur.
Ancak gerçek hayattaki bir Uygulamada, genellikle tamamen aynı görünmesi gereken çok daha fazlasına sahip olacaksınız. Ve elbette sadece düğmeler değil, genellikle metin bloklarınızın, metin kutularınızın ve birleşik giriş kutularınızın, vb. Uygulamanızda aynı görünmesini isteyeceksiniz. Elbette bunu başarmanın daha iyi bir yolu olmalı -styling. Aşağıdaki şemada gösterildiği gibi, stili birden fazla öğeye bir dizi özellik değeri uygulamanın uygun bir yolu olarak düşünebilirsiniz.
Bazı özelliklerle XAML'de oluşturulan üç düğmeyi içeren örneğe bakalım.
<Window x:Class = "XAMLStyle.MainWindow"
xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d = "http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local = "clr-namespace:XAMLStyle" mc:Ignorable = "d"
Title = "MainWindow" Height = "350" Width = "604">
<StackPanel>
<Button Content = "Button1" Height = "30" Width = "80" Foreground = "Blue"
FontSize = "12" Margin = "10"/>
<Button Content = "Button2" Height = "30" Width = "80" Foreground = "Blue"
FontSize = "12" Margin = "10"/>
<Button Content = "Button3" Height = "30" Width = "80" Foreground = "Blue"
FontSize = "12" Margin = "10"/>
</StackPanel>
</Window>
Yukarıdaki koda baktığınızda, tüm düğmeler için yükseklik, genişlik, ön plan rengi, yazı tipi boyutu ve kenar boşluğu özelliklerinin aynı kaldığını göreceksiniz. Yukarıdaki kod derlendiğinde ve yürütüldüğünde, aşağıdaki çıktıyı gösterecektir -
Şimdi aynı örneğe bir göz atalım, ancak bu sefer kullanacağız style.
<Window x:Class = "XAMLStyle.MainWindow"
xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d = "http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local = "clr-namespace:XAMLStyle" mc:Ignorable = "d"
Title = "MainWindow" Height = "350" Width = "604">
<Window.Resources>
<Style x:Key = "myButtonStyle" TargetType = "Button">
<Setter Property = "Height" Value = "30"/>
<Setter Property = "Width" Value = "80"/>
<Setter Property = "Foreground" Value = "Blue"/>
<Setter Property = "FontSize" Value = "12"/>
<Setter Property = "Margin" Value = "10"/>
</Style>
</Window.Resources>
<StackPanel>
<Button Content = "Button1" Style = "{StaticResource myButtonStyle}"/>
<Button Content = "Button2" Style = "{StaticResource myButtonStyle}"/>
<Button Content = "Button3" Style = "{StaticResource myButtonStyle}"/>
</StackPanel>
</Window>
Stiller kaynak sözlüğünde tanımlanır ve her stilin benzersiz bir anahtar tanımlayıcısı ve bir hedef türü vardır. <style> içinde, stile dahil edilecek her özellik için birden çok ayarlayıcı etiketinin tanımlandığını görebilirsiniz.
Yukarıdaki örnekte, her bir düğmenin tüm ortak özellikleri artık stilde tanımlanmıştır ve ardından stil özelliği StaticResource biçimlendirme uzantısı aracılığıyla ayarlanarak her düğmeye benzersiz bir anahtarla atanır.
Yukarıdaki kod derlendiğinde ve çalıştırıldığında, aynı çıktı olan aşağıdaki pencereyi üretecektir.
Bunu böyle yapmanın avantajı hemen belli oluyor. Bu stili kapsamının herhangi bir yerinde yeniden kullanabiliriz ve onu değiştirmemiz gerekirse, onu her öğe yerine stil tanımında bir kez değiştiririz.
Bir stilin hangi düzeyde tanımlandığı, o stilin kapsamını anında sınırlar. Dolayısıyla, kapsam, yani stili nerede kullanabileceğiniz, onu nerede tanımladığınıza bağlıdır. Stil aşağıdaki seviyelerde tanımlanabilir -
Sr.No | Seviyeler ve Açıklama |
---|---|
1 | Kontrol Düzeyi Kontrol düzeyinde bir stil tanımlama, yalnızca o belirli kontrole uygulanabilir. |
2 | Düzen Düzeyi Herhangi bir düzen düzeyinde bir stil tanımlamaya yalnızca bu düzen ve yalnızca alt öğeleri tarafından erişilebilir. |
3 | Pencere Düzeyi Bir pencere düzeyinde bir stil tanımlamak, o penceredeki tüm öğeler tarafından erişilebilir olabilir. |
4 | Uygulama Seviyesi Uygulama düzeyinde bir stil tanımlamak, stilin tüm uygulamada erişilebilir olmasını sağlar. |