WPF-スタイル

スタイルでは、高さ、幅、フォントサイズなど、オブジェクトの既存のプロパティのみを設定できます。
コントロールのデフォルトの動作のみを指定できます。
複数のプロパティを単一のスタイルに追加できます。

スタイルは、コントロールのセットに均一な外観または外観を与えるために使用されます。暗黙的なスタイルは、特定のタイプのすべてのコントロールに外観を適用し、アプリケーションを簡素化するために使用されます。 3つのボタンを想像してください。それらはすべて同じ、同じ幅と高さ、同じフォントサイズ、同じ前景色などに見える必要があります。これらすべてのプロパティをボタン要素自体に設定できますが、それでもすべてのボタンに問題はありません。次の図をご覧ください。

スタイル

しかし、実際のアプリケーションでは、通常、まったく同じように見える必要があるこれらの多くがあります。もちろん、ボタンだけでなく、通常はテキストブロック、テキストボックス、コンボボックスなどが必要になります。アプリケーション全体で同じように見えます。確かに、これを達成するためのより良い方法が必要であり、*スタイリング*として知られています。スタイルは、プロパティ値のセットを複数の要素に適用する便利な方法と考えることができます。次の図をご覧ください。

スタイルが定義されています

例

この概念を理解するために簡単な例を見てみましょう。新しいWPFプロジェクトを作成することから始めます。

ツールボックスからデザインウィンドウに3つのボタンをドラッグします。
次のXAMLコードは3つのボタンを作成し、それらをいくつかのプロパティで初期化します。

<Window x:Class = "WPFStyle.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: WPFStyle"
   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>

上記のコードを見ると、すべてのボタンの高さ、幅、前景色、フォントサイズ、およびマージンプロパティが同じであることがわかります。これで、上記のコードがコンパイルされ実行されると、次のウィンドウが表示されます。

3つのボタンの出力

次に同じ例を見てみましょうが、今回は 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>

スタイルはリソースディクショナリで定義され、各スタイルには一意のキー識別子とターゲットタイプがあります。 <style>内では、スタイルに含まれる各プロパティに対して複数のセッタータグが定義されていることがわかります。

上記の例では、各ボタンのすべての共通プロパティがスタイルで定義され、StaticResourceマークアップ拡張を介してスタイルプロパティを設定することにより、スタイルが一意のキーで各ボタンに割り当てられます。

上記のコードをコンパイルして実行すると、次のウィンドウ（同じ出力）が表示されます。

同じ出力

このようにすることの利点はすぐに明らかになります。そのスタイルの範囲内であればどこでも再利用できます。変更する必要がある場合は、各要素ではなくスタイル定義で一度変更するだけです。

スタイルがどのレベルで定義されているかは、そのスタイルの範囲を即座に制限します。スコープ、つまりスタイルを使用できる場所は、定義した場所によって異なります。スタイルは、次のレベルで定義することができます-

Sr.No	Levels & Description
1	Control Level コントロールレベルでのスタイルの定義は、その特定のコントロールにのみ適用できます。以下に示すのは、ボタンとTextBlockが独自のスタイルを持つコントロールレベルの例です。
2	Layout Level レイアウトレベルでスタイルを定義すると、そのレイアウトとその子要素のみがスタイルにアクセスできるようになります。
3	Window Level ウィンドウレベルでスタイルを定義すると、そのウィンドウ上のすべての要素からスタイルにアクセスできるようになります。
4	Application Level アプリレベルでスタイルを定義すると、アプリケーション全体でスタイルにアクセスできるようになります。同じ例を取り上げましょう。ただし、ここでは、app.xamlファイルにスタイルを入れて、アプリケーション全体でアクセスできるようにします。

Wpf-styles

WPF-スタイル

例