[WPF/xaml]リソースディクショナリを作って、画面のコントロールのstyleを変える

# やりたいこと
コントロールの見た目をいろいろ変えたいときに、画面のxamlにいじくったstyleを書いているとごちゃごちゃしてしまうので、別のファイルにstyleだけまとめて書きたい。

# サンプルコード
ディクショナリのコード。
styleの中身は今回の肝ではないので、途中省略している。
もとになったstyleは、以前作成したコードなので、[こちら](https://qiita.com/tera1707/items/a7fcdd95fc3120ae3c8b#%E3%82%B5%E3%83%B3%E3%83%97%E3%83%AB%E3%82%B3%E3%83%BC%E3%83%89)を参照。

```Dictionary1.xaml
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:local="clr-namespace:WpfAnimation">
    
    <!-- 1つ目のチェックボックスのスタイル -->
    <Style TargetType="CheckBox" x:Key="MyCheckboxStyle">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type CheckBox}">
                             ・
                             ・
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <!-- 2つ目のチェックボックスのスタイル -->
    <Style TargetType="CheckBox" x:Key="MyCheckboxStyle2">
        <Setter Property="Background" Value="Red"/>
    </Style>
</ResourceDictionary>
```

ディクショナリを使う画面のxamlのコード。

```MainWindows.xaml
<Window x:Class="WpfAnimation.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:WpfAnimation"
        mc:Ignorable="d"
        Title="MainWindow" Height="150" Width="150" Background="Gray">

    <Window.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/Dictionary1.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Window.Resources>
    
    <Grid>
        <StackPanel Margin="20">
            <CheckBox Style="{StaticResource MyCheckboxStyle}"/>
            <CheckBox Style="{StaticResource MyCheckboxStyle2}" IsChecked="True"/>
        </StackPanel>
    </Grid>
</Window>
```

# 実装の流れ

プロジェクトを右クリックして[追加] > [新しい項目]を選択し、[リソースディクショナリ(WPF)]を選択する。(名前は適当につける)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/352601/75dbf8b9-ad38-4a93-65b7-749eef0720a7.png)

先日作った([こちら参照](https://qiita.com/tera1707/items/a7fcdd95fc3120ae3c8b))、チェックボックスのstyleをそのディクショナリに切り取りして移し、スタイルに、画面のxamlから参照できるようにKey名を付ける。

```Dictionary1の一部.xaml
<Style TargetType="CheckBox" x:Key="MyCheckboxStyle">
と
<Style TargetType="CheckBox" x:Key="MyCheckboxStyle2">
```

リソースを使う側(ここではMainWindow.xaml)で、ディクショナリの参照先を記述する。

```MainWindowの一部.xaml
<Window.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <!-- ここで、作ったDictionaryを参照しにいっている -->
            <ResourceDictionary Source="/Dictionary1.xaml"/>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Window.Resources>
```

で、配置したCheckBoxのstyleに、スタイルを指定してやる。


```MainWindowの一部.xaml
<CheckBox Style="{StaticResource MyCheckboxStyle}"/>
<CheckBox Style="{StaticResource MyCheckboxStyle2}" IsChecked="True"/>
```

# 結果
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/352601/a4ee88a7-6b59-4743-b072-0a51eaa49f54.png)

上のが一個目のスタイル。下のが二個目のスタイル。