Aracılığıyla paylaş

Denetim için stil oluşturma (WPF .NET)

  • Makale

Windows Presentation Foundation (WPF) ile mevcut bir denetimin görünümünü kendi yeniden kullanılabilir stilinizle özelleştirebilirsiniz. Stiller uygulamanıza, pencerelerinize ve sayfalarınıza genel olarak veya doğrudan denetimlere uygulanabilir.

Önemli

.NET 7 ve .NET 6 için Masaüstü Kılavuzu belgeleri yapım aşamasındadır.

Stil oluşturma

bir Style veya daha fazla öğeye özellik değerleri kümesi uygulamak için uygun bir yol olarak düşünebilirsiniz. veya gibi Window bir öğesinden FrameworkElementFrameworkContentElement türetilen herhangi bir Buttonöğede stil kullanabilirsiniz.

Stil bildirmenin en yaygın yolu, XAML dosyasının Resources bölümündeki bir kaynaktır. Stiller kaynak olduğundan, tüm kaynaklar için geçerli olan aynı kapsam kurallarına uyarlar. Basitçe ifade edin, bir stili bildirdiğiniz yer, stilin uygulanabileceği yeri etkiler. Örneğin, stili uygulama tanımı XAML dosyanızın kök öğesinde bildirirseniz, stil uygulamanızın herhangi bir yerinde kullanılabilir.

<Application x:Class="IntroToStylingAndTemplating.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:IntroToStylingAndTemplating"
             StartupUri="WindowExplicitStyle.xaml">
    <Application.Resources>
        <ResourceDictionary>
            
            <Style x:Key="Header1" TargetType="TextBlock">
                <Setter Property="FontSize" Value="15" />
                <Setter Property="FontWeight" Value="ExtraBold" />
            </Style>
            
        </ResourceDictionary>
    </Application.Resources>
</Application>

Stili uygulamanın XAML dosyalarından birinde bildirirseniz, stil yalnızca bu XAML dosyasında kullanılabilir. Kaynaklar için kapsam belirleme kuralları hakkında daha fazla bilgi için bkz . XAML kaynaklarına genel bakış.

<Window x:Class="IntroToStylingAndTemplating.WindowSingleResource"
        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:IntroToStylingAndTemplating"
        mc:Ignorable="d"
        Title="WindowSingleResource" Height="450" Width="800">
    <Window.Resources>
        
        <Style x:Key="Header1" TargetType="TextBlock">
            <Setter Property="FontSize" Value="15" />
            <Setter Property="FontWeight" Value="ExtraBold" />
        </Style>
        
    </Window.Resources>
    <Grid />
</Window>

Stil, stilin <Setter> uygulandığı öğelerde özellikleri ayarlayan alt öğelerden oluşur. Yukarıdaki örnekte, stilin özniteliği aracılığıyla türlere TextBlock uygulanacak şekilde ayarlandığına TargetType dikkat edin. Stil olarak ve FontWeight olarak ayarlanır FontSize15.ExtraBold Stilin değiştiği her özellik için bir <Setter> ekleyin.

Stili örtük olarak uygulama

A Style , bir özellik değerleri kümesini birden çok öğeye uygulamanın kullanışlı bir yoludur. Örneğin, bir pencerede aşağıdaki TextBlock öğeleri ve bunların varsayılan görünümünü göz önünde bulundurun.

<StackPanel>
    <TextBlock>My Pictures</TextBlock>
    <TextBlock>Check out my new pictures!</TextBlock>
</StackPanel>

Styling sample screenshot before

Her TextBlock öğede ve gibi FontSizeFontFamilyözellikleri doğrudan ayarlayarak varsayılan görünümü değiştirebilirsiniz. Ancak, öğelerinizin TextBlock bazı özellikleri paylaşmasını istiyorsanız, burada gösterildiği gibi XAML dosyanızın bölümünde bir ResourcesStyle oluşturabilirsiniz.

<Window.Resources>
    <!--A Style that affects all TextBlocks-->
    <Style TargetType="TextBlock">
        <Setter Property="HorizontalAlignment" Value="Center" />
        <Setter Property="FontFamily" Value="Comic Sans MS"/>
        <Setter Property="FontSize" Value="14"/>
    </Style>
</Window.Resources>

Stilinizin TextBlock türünü ayarladığınızda TargetType ve özniteliğini x:Key atladığınızda, stil genellikle XAML dosyasının TextBlock kendisi olan stil kapsamındaki tüm öğelere uygulanır.

TextBlock Artık öğeler aşağıdaki gibi görünür.

Styling sample screenshot base style

Stili açıkça uygulama

Stile değer içeren bir x:Key öznitelik eklerseniz, stil artık tüm öğelerine TargetTypeörtük olarak uygulanmaz. Yalnızca stile açıkça başvuran öğelere stil uygulanır.

Önceki bölümdeki stil aşağıdadır, ancak özniteliğiyle x:Key bildirilir.

<Window.Resources>
    <Style x:Key="TitleText" TargetType="TextBlock">
        <Setter Property="HorizontalAlignment" Value="Center" />
        <Setter Property="FontFamily" Value="Comic Sans MS"/>
        <Setter Property="FontSize" Value="14"/>
    </Style>
</Window.Resources>

Stili uygulamak için, burada gösterildiği gibi staticResource işaretleme uzantısını kullanarak öğesindeki x:Key özelliğini değerine ayarlayınStyle.

<StackPanel>
    <TextBlock Style="{StaticResource TitleText}">My Pictures</TextBlock>
    <TextBlock>Check out my new pictures!</TextBlock>
</StackPanel>

İkinci TextBlock öğesi değişmeden kalırken, ilk TextBlock öğenin stiline uygulandığına dikkat edin. Önceki bölümdeki örtük stil özniteliğini belirten x:Key bir stile değiştirildi, yani stilden etkilenen tek öğe, stile doğrudan başvuran stildir.

Styling sample screenshot textblock

Stil açıkça veya örtük olarak uygulandıktan sonra korumalı hale gelir ve değiştirilemez. Uygulanmış bir stili değiştirmek istiyorsanız, varolan stili değiştirmek için yeni bir stil oluşturun. Daha fazla bilgi için özelliğine IsSealed bakın.

Özel mantığa göre uygulanacak stili seçen bir nesne oluşturabilirsiniz. Bir örnek için, sınıf için sağlanan örne StyleSelector bakın.

Program aracılığıyla stil uygulama

Adlandırılmış stili bir öğeye program aracılığıyla atamak için, resources koleksiyonundan stili alın ve öğenin Style özelliğine atayın. Kaynak koleksiyonundaki öğeler türündedir Object. Bu nedenle, özelliğine atamadan Style önce alınan stili olarak System.Windows.Style atamanız gerekir. Örneğin, aşağıdaki kod adlandırılmış textblock1 bir TextBlock öğesinin stilini tanımlı stile TitleTextayarlar.

textblock1.Style = (Style)Resources["TitleText"];

textblock1.Style = CType(Resources("TitleText"), Windows.Style)

Stili genişletme

İki öğenizin TextBlock ve ortalanmış HorizontalAlignmentgibi FontFamily bazı özellik değerlerini paylaşmasını isteyebilirsiniz. Ancak Resimlerim metninin bazı ek özelliklere sahip olmasını da istiyorsunuz. Burada gösterildiği gibi, ilk stili temel alan yeni bir stil oluşturarak bunu yapabilirsiniz.

<Window.Resources>
    <!-- .... other resources .... -->

    <!--A Style that affects all TextBlocks-->
    <Style TargetType="TextBlock">
        <Setter Property="HorizontalAlignment" Value="Center" />
        <Setter Property="FontFamily" Value="Comic Sans MS"/>
        <Setter Property="FontSize" Value="14"/>
    </Style>
    
    <!--A Style that extends the previous TextBlock Style with an x:Key of TitleText-->
    <Style BasedOn="{StaticResource {x:Type TextBlock}}"
           TargetType="TextBlock"
           x:Key="TitleText">
        <Setter Property="FontSize" Value="26"/>
        <Setter Property="Foreground">
            <Setter.Value>
                <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                    <LinearGradientBrush.GradientStops>
                        <GradientStop Offset="0.0" Color="#90DDDD" />
                        <GradientStop Offset="1.0" Color="#5BFFFF" />
                    </LinearGradientBrush.GradientStops>
                </LinearGradientBrush>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>

<StackPanel>
    <TextBlock Style="{StaticResource TitleText}" Name="textblock1">My Pictures</TextBlock>
    <TextBlock>Check out my new pictures!</TextBlock>
</StackPanel>

Bu TextBlock stil artık ortalanmış, boyutu 26ve ön plan rengi örnekte gösterilene ayarlanmış LinearGradientBrush bir yazı tipi kullanıyorComic Sans MS. Temel stilin FontSize değerini geçersiz kıldığını fark edin. içinde aynı özelliğe StyleSetter işaret eden birden Setter fazla öğe varsa, en son bildirilen öncelik kazanır.

Aşağıda öğelerin artık nasıl TextBlock göründüğü gösterilmektedir:

Styled TextBlocks

Bu TitleText stil, türü için TextBlock oluşturulan ve ile BasedOn="{StaticResource {x:Type TextBlock}}"başvuruda bulunan stili genişletir. Ayrıca, öğesini içeren x:Key bir stili, stilini kullanarak x:Key da genişletebilirsiniz. Örneğin, adlı Header1 bir stil varsa ve bu stili genişletmek istiyorsanız kullanabilirsiniz BasedOn="{StaticResource Header1}".

TargetType özelliğinin ve x:Key özniteliğinin ilişkisi

Daha önce gösterildiği gibi, stili atamadan özelliğini olarak ayarlamakTargetType, stilin x:Key tüm TextBlock öğelere uygulanmasına neden olur.TextBlock Bu durumda, x:Key örtük olarak olarak {x:Type TextBlock}ayarlanır. Bu, değeri dışında {x:Type TextBlock}bir değere açıkça ayarlarsanız öğesinin x:KeyStyle tüm TextBlock öğelere otomatik olarak uygulanmayacağı anlamına gelir. Bunun yerine, stili (değerini kullanarak x:Key ) öğelere TextBlock açıkça uygulamanız gerekir. Stiliniz kaynaklar bölümündeyse ve stilinizde özelliğini ayarlamazsanız TargetType özniteliğini x:Key ayarlamanız gerekir.

özelliği için x:KeyTargetType varsayılan bir değer sağlamaya ek olarak, ayarlayıcı özelliklerinin uygulanacağı türü belirtir. belirtmezsenizTargetType, söz dizimini Property="ClassName.Property"kullanarak nesnelerinizdeki Setter özellikleri sınıf adıyla nitelemeniz gerekir. Örneğin, ayarı Property="FontSize"yerine veya "Control.FontSize"olarak ayarlamanız Property"TextBlock.FontSize" gerekir.

Ayrıca, birçok WPF denetiminin diğer WPF denetimlerinin birleşiminden oluştuğuna dikkat edin. Bir türün tüm denetimleri için geçerli olan bir stil oluşturursanız beklenmeyen sonuçlar alabilirsiniz. Örneğin, içinde türünü hedefleyen TextBlock bir Windowstil oluşturursanız, stili gibi başka bir denetimin parçası olsa TextBlock bile penceredeki tüm TextBlock denetimlere ListBoxuygulanır.

Ayrıca bkz.