Použití stylů WPF

V předchozí kapitole, kde jsme představili koncept stylů, jsme použili velmi jednoduchý příklad místně definovaného stylu, který se zaměřil na konkrétní typ ovládacích prvků - TextBlock. Styly však mohou být definovány v několika různých úrovních, v závislosti na tom, kde a jak je chcete použít, a můžete dokonce omezit styly tak, aby byly použity pouze u ovládacích prvků, kde je explicitně chcete používat. V této kapitole vám ukážu všechny ostatní způsoby, jakými lze styl definovat.

Místní styl specifického ovládacího prvku

Jednoduše můžete definovat styl přímo na konkrétní ovládací prvek, jako např.:

<Window x:Class="WpfTutorialSamples.Styles.ControlSpecificStyleSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="ControlSpecificStyleSample" Height="100" Width="300">
    <Grid Margin="10">
        <TextBlock Text="Style test">
            <TextBlock.Style>
                <Style>
                    <Setter Property="TextBlock.FontSize" Value="36" />
                </Style>
            </TextBlock.Style>
        </TextBlock>
    </Grid>
</Window>

V tomto příkladu styl ovlivňuje pouze tento konkrétní ovládací prvek TextBlock, tak proč se obtěžovat? No, v tomto případě to skutečně nedává vůbec žádný smysl. Mohl jsem nahradit všechny, extra značky pouze jedinou změnou vlastností FontSize ovládacího prvku TextBlock, ale jak uvidíme později, styly mohou udělat mnohem více než jen nastavování vlastností. Například pokud bychom u výše uvedeného příkladu použili přepínač stylů, mohlo by to být užitečný i v reálné aplikaci. Avšak většina stylů, které budete někdy definovat, bude pravděpodobně mnohem složitější.

Styl místně podřízeného ovládacího prvku

Pomocí sekce Resources v ovládacím prvku můžete cílit na podřízené ovládací prvky tohoto ovládacího prvku (a podřízené ovládací prvky těchto podřízených ovládacích prvků a tak dále). To je v podstatě to, co jsme udělali v úvodu příkladu v poslední kapitole, která vypadala takto:

<Window x:Class="WpfTutorialSamples.Styles.SimpleStyleSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="SimpleStyleSample" Height="200" Width="250">
    <StackPanel Margin="10">
        <StackPanel.Resources>
            <Style TargetType="TextBlock">
                <Setter Property="Foreground" Value="Gray" />
                <Setter Property="FontSize" Value="24" />
            </Style>
        </StackPanel.Resources>
        <TextBlock>Header 1</TextBlock>
        <TextBlock>Header 2</TextBlock>
        <TextBlock Foreground="Blue">Header 3</TextBlock>
    </StackPanel>
</Window>

To je skvělé, pokud potřebujeme stylovat více místních prvků. Naprosto logické, to bude v dialogu, kde prostě potřebujeme, aby sada ovládacích prvků vypadala stejně, namísto toho, abychom nastavovali jednotlivé vlastností na každém z nich.

Styly platné pro celé okno

Dalším úrovní v rozsahu hierarchie stylů je definovat je v rámci prostředků okna. To se provádí přesně stejným způsobem, jako je uvedeno výše pro StackPanel, ale je to užitečné v těch situacích, kdy chcete, aby se konkrétní styl vztahoval na všechny ovládací prvky v okně (nebo UserControl, pokud jde o tuto záležitost) a nejen místně v rámci konkrétního ovládacího prvku. Zde je upravený příklad:

<Window x:Class="WpfTutorialSamples.Styles.WindowWideStyleSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="WindowWideStyleSample" Height="200" Width="300">
    <Window.Resources>
        <Style TargetType="TextBlock">
            <Setter Property="Foreground" Value="Gray" />
            <Setter Property="FontSize" Value="24" />
        </Style>
    </Window.Resources>
    <StackPanel Margin="10">
        <TextBlock>Header 1</TextBlock>
        <TextBlock>Header 2</TextBlock>
        <TextBlock Foreground="Blue">Header 3</TextBlock>
    </StackPanel>
</Window>

Jak můžete vidět, výsledek je přesně stejný. To tedy znamená, že můžete mít ovládací prvky umístěné všude v okně a styl bude stále aplikován.

Styly platné pro celou aplikaci

Pokud chcete, aby vaše styly byly používány v celé aplikaci napříč různými okny, můžete je definovat pro celou aplikaci. To se provádí v souboru App.xaml, který vám Visual Studio pravděpodobně vytvořilo, a provádí se stejně, jako jsme to udělali v příkladu týkajícího se celého okna:

App.xaml

<Application x:Class="WpfTutorialSamples.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	 StartupUri="Styles/WindowWideStyleSample.xaml">
    <Application.Resources>
        <Style TargetType="TextBlock">
            <Setter Property="Foreground" Value="Gray" />
            <Setter Property="FontSize" Value="24" />
        </Style>
    </Application.Resources>
</Application>

Okno

<Window x:Class="WpfTutorialSamples.Styles.WindowWideStyleSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="ApplicationWideStyleSample" Height="200" Width="300">
    <StackPanel Margin="10">
        <TextBlock>Header 1</TextBlock>
        <TextBlock>Header 2</TextBlock>
        <TextBlock Foreground="Blue">Header 3</TextBlock>
    </StackPanel>
</Window>

Explicitní použití stylů

Máte velkou kontrolu nad tím, jak a kde uplatnit stylování ovládacích prvků, od místních stylů až po styly celé aplikace, které vám pomohou získat konzistentní vzhled po celé aplikace. Ale zatím všechny naše styly, jsme vytvořili, pouze pro konkrétní ovládací prvek a ten pak byl použit pro všechny tyto ovládací prvky. Takto to ale být vůbec nemusí.

Nastavením vlastnosti x:Key ve stylu, říkáte WPF, že tento styl chcete použít pouze tehdy, pokud se na něj explicitně odkazuje určitý ovládací prvek. Zkusme si to na příkladu:

<Window x:Class="WpfTutorialSamples.Styles.ExplicitStyleSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="ExplicitStyleSample" Height="150" Width="300">
    <Window.Resources>
        <Style x:Key="HeaderStyle" TargetType="TextBlock">
            <Setter Property="Foreground" Value="Gray" />
            <Setter Property="FontSize" Value="24" />
        </Style>
    </Window.Resources>
    <StackPanel Margin="10">
        <TextBlock>Header 1</TextBlock>
        <TextBlock Style="{StaticResource HeaderStyle}">Header 2</TextBlock>
        <TextBlock>Header 3</TextBlock>
    </StackPanel>
</Window>

Všimněte si, že i když TargetType je nastavena na TextBlock a styl je definován pro celé okno, pouze TextBlock uprostřed, kde jsem explicitně odkazovat na Styl HeaderStyle, tento styl používá. To nám umožňuje definovat styly, které cílí na určitý typ ovládacího prvku, ale použít jej můžeme jen tam, kde ho skutečně potřebujeme.

Shrnutí

WPF styling umožňuje snadno znovu použít určitý vzhled pro ovládací prvky napříč celou aplikací. Pomocí vlastnosti x:Key můžete rozhodnout, zda má být styl explicitně odkazován tak, aby se projevil, nebo zda by měl cílit na všechny ovládací prvky bez rozdílu.