その2
http://blogs.wankuma.com/kazuki/archive/2007/10/24/103981.aspx
さて、その2でも結構ボタンっぽくなってきた。
でも、フォーカスもらったときの枠線が矩形のまま!
これを解決するには、FocusVisualStyleプロパティにStyleを設定すればいいみたい。
Control.Templateに対して楕円状に並んだ点線を表示するようにしてみた。
フォーカス貰った時の点線も丸くした版
<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.FocusVisualStyle>
<Style TargetType="{x:Type Control}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Ellipse StrokeDashArray="1 2" Stroke="Red" Margin="3"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Button.FocusVisualStyle>
<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>
</Style>
</Button.Style>
<Button.Template>
<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>
</Button.Template>
</Button>
</Grid>
</Window>
さっそく動作確認!!!
OKばっちりだ。