WPF - Podstawy wzorca MVVM Cz 3 - Zastosowanie atrybutów właściwości w słownikach

Jak wiadomo w każdej kontrolce można ustawiać tzw. style takie jak wysokość, szerokość, margines, wielkość czcionki itd. Jedak można te style ustawiać globalnie tzn. z poziomu kontenera lub słowników (Dictionary). Przykładowo mając kilka przycisków w naszym projekcie - uciążliwe jest ustawianie atrybutów właściwości dla każdego przycisku osobno. Wejdźmy więc do naszego głównego okna MainWidnow.xaml i zaimplementujmy style dla całego kontenera. Jako przykład możemy zastosować nasz StackPanel, gdzie znajdują się Buttony:

<StackPanel.Resources>
                <Style x:Key="CustomButtonStyle" TargetType="Button">
                    <Setter Property="Margin" Value="5,15,5,5"/>
                    <Setter Property="FontSize" Value="16"/>
                    <Setter Property="Height" Value="40"/>
                    <Setter Property="FontStyle" Value="Italic"/>
                    <Setter Property="FontWeight" Value="Bold"/>
                </Style>
            </StackPanel.Resources>
            <Button Name="AddWorker" Content="Dodaj Pacownika" />
            <Button Name="EraseWorker" Content="Usuń Pracownika" />
            <Button Name="CloseApp" Content="Zamknij aplikację"  />
</StackPanel>

Dzięki takiemu rozwiązaniu zaoszczędzimy wpisywania atrybutów dot. stylów w każdym z przycisków. Zasięg tych atrybutów ogranicza się do kontenera, którym te style się znajdują. Można również zastosować globalnie te wartości dla wszystkich stylów w programie. Stwórzmy więc Pierwszy słownik, gdzie ustawimy te atrybuty globalnie. Tworzymy nowy folder w projekcie o nazwie Dictionaries i tworzymy w nim nowy obiekt - Resource Dictionary:

Wewnątrz słownika ustawmy style dla przycisku (Button), Etykiey (Label) oraz Pola tekstowego (TextBox):

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Style x:Key="CustomButtonStyle" TargetType="Button">
        <Setter Property="Margin" Value="5,15,5,5"/>
        <Setter Property="FontSize" Value="16"/>
        <Setter Property="Height" Value="40"/>
        <Setter Property="FontStyle" Value="Italic"/>
        <Setter Property="FontWeight" Value="Bold"/>
    </Style>
    <Style x:Key="CustomTextBoxStyle" TargetType="TextBox">
        <Setter Property="HorizontalAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Height" Value="40"/>
    </Style>
    <Style x:Key="CustomLabelStyle" TargetType="Label">
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="FontSize" Value="16"/>
        <Setter Property="FontWeight"  Value="Bold"/>
        <Setter Property="Height" Value="40"/>
    </Style>
</ResourceDictionary>

Przejdźmy następnie do pliku App.xaml i tam w sekcji Application, gdzie należy stworzyć następujące odwołanie do słownika:

<Application x:Class="TestBlog.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
            <ResourceDictionary>
                <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="Dictionaries/GlobalCustomSylesDic.xaml"/>
            </ResourceDictionary.MergedDictionaries>
            </ResourceDictionary>
    </Application.Resources>
</Application>

Teraz z każdego miejsca w programie możemy odwoływać się do stylów zapisanych w tym słowniku w folderze Dictionaries. Przykładowo dla naszych trzech buttonów odwołanie wygląda następująco: 

<StackPanel>
            <Button Name="AddWorker" Content="Dodaj Pacownika" 
                    Style="{StaticResource CustomButtonStyle}"/>
            <Button Name="EraseWorker" Content="Usuń Pracownika" 
                    Style="{StaticResource CustomButtonStyle}"/>
            <Button Name="CloseApp" Content="Zamknij aplikację" 
                    Style="{StaticResource CustomButtonStyle}"/>
</StackPanel>

Odwołujemy się jedynie przy pomocy prostego atrybutu Style do zasobów statycznych w pliku dictionary, jednocześnie kod jest o wiele bardziej przejrzysty i wolny od powtarzających się atrybutów właściwości.

Nasze okno po drobnych poprawkach wygląda następująco:

Każdy atrybut można nadpisywać wprowadzając wartości bezpośrednio w danej kontrolce. Wówczas wartość ze słownika nie jest brana pod uwagę lecz ta nadpisana bezpośrednio w kontrolce. Zapraszam od kolejnego wpisu już wkrótce.

Pod linkiem znajduje się cały projekt z 3-częściowego kursu: 

Pobierz projekt MVVM