その3
http://blogs.wankuma.com/kazuki/archive/2007/10/24/103986.aspx
動作としては、その3で一応完成~。
ここでは、Styleにまとめてボタンの見た目を外だしにしちゃう。
Styleは、Property属性とValue属性で値を設定できる。
それだけ。
ってことで早速TemplateやFocusVisualStyleをStyleに一本化してみた。
Window1.xaml Styleにまとめた版
<Window x:Class="WpfStepByStep.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="ControlTemplate" Height="150" Width="150">
<Grid Margin="10">
<Button Content="Hello world" >
<Button.Style>
<Style TargetType="{x:Type Button}">
<Style.Triggers>
<!-- マウスが上に来た時の色変え -->
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Foreground" Value="Blue" />
</Trigger>
<!-- マウスが押下されたときの色変え -->
<Trigger Property="IsPressed" Value="true">
<Setter Property="Background" Value="Yellow" />
</Trigger>
</Style.Triggers>
<!-- ボタンのテンプレート -->
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Ellipse Fill="{TemplateBinding Property=Background}"
Stroke="{TemplateBinding Property=Foreground}"/>
<ContentPresenter
HorizontalAlignment="{TemplateBinding Property=HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding Property=VerticalContentAlignment}"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<!-- フォーカス貰った時の点線も丸く -->
<Setter Property="FocusVisualStyle">
<Setter.Value>
<Style TargetType="{x:Type Control}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Ellipse StrokeDashArray="1 2" Stroke="Red" Margin="3"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Setter.Value>
</Setter>
</Style>
</Button.Style>
</Button>
</Grid>
</Window>
ほとんど真っ赤になってしまいました。
Contentは、ボタンに応じて違うことも多いのでContentだけボタンに残して後はStyleへ。
こうすると何がいいかって、このままじゃ何もいいことはありません。
Styleは、WindowのResourcesに移動させることができちゃいます。
こうすると、Windowに置かれた全てのボタンに対してスタイルが適用されます。
Applicationに置くと、全てのWindowに置かれたボタンに対してスタイルが適用されます。
その様子はまた次回。