Windows8でWPFのトグルボタン表示がおかしい
Windows8環境のWPFアプリでは、ToggleButtonを押しても、トグル状態の押し込んだ表示が行われません。
テストコード
ToggleButtonを配置しただけの、シンプルな画面です。
ボタンをクリックしても、トグル状態の表示が行われません。
<Window x:Class="WpfApplication1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="350" Width="525"> <Grid> <ToggleButton Content="ToggleButton" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="20"/> </Grid> </Window>
Snoopで、このToggleButtonのIsCheckedプロパティを見てみると、
IsCheckedの値はちゃんと変わっています。
トグル時の表示の変化が無いようです。
Win8のToggleButtonのコントロールテンプレート
参考までに、Win8&VS2012の環境で「テンプレートの編集⇒コピーして編集」を実行して、ToggleButtonのControlTemplateを出力してみました。
ToggleButtonのテンプレート
<Window x:Class="WpfApplication1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="350" Width="525"> <Window.Resources> <Style x:Key="ToggleButtonStyle1" TargetType="{x:Type ToggleButton}"> <Setter Property="FocusVisualStyle"> <Setter.Value> <Style> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate> <Rectangle Margin="2" SnapsToDevicePixels="True" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/> </ControlTemplate> </Setter.Value> </Setter> </Style> </Setter.Value> </Setter> <Setter Property="Background" Value="#FFDDDDDD"/> <Setter Property="BorderBrush" Value="#FF707070"/> <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> <Setter Property="BorderThickness" Value="1"/> <Setter Property="HorizontalContentAlignment" Value="Center"/> <Setter Property="VerticalContentAlignment" Value="Center"/> <Setter Property="Padding" Value="1"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type ToggleButton}"> <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True"> <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> </Border> <ControlTemplate.Triggers> <Trigger Property="Button.IsDefaulted" Value="True"> <Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/> </Trigger> <Trigger Property="IsMouseOver" Value="True"> <Setter Property="Background" TargetName="border" Value="#FFBEE6FD"/> <Setter Property="BorderBrush" TargetName="border" Value="#FF3C7FB1"/> </Trigger> <Trigger Property="IsPressed" Value="True"> <Setter Property="Background" TargetName="border" Value="#FFC4E5F6"/> <Setter Property="BorderBrush" TargetName="border" Value="#FF2C628B"/> </Trigger> <Trigger Property="IsEnabled" Value="False"> <Setter Property="Background" TargetName="border" Value="#FFF4F4F4"/> <Setter Property="BorderBrush" TargetName="border" Value="#FFADB2B5"/> <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="#FF838383"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> </Window.Resources> <Grid> <ToggleButton Content="ToggleButton" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="20" Style="{DynamicResource ToggleButtonStyle1}"/> </Grid> </Window>
うーん、確かにこれじゃ、トグル時に表示が切り替わらないよなぁ。。。
↑のテンプレートのTriggerに、以下の内容を追加すれば、Win8環境ではトグル表示がされるようになります。
<Trigger Property="IsChecked" Value="True"> <Setter Property="Background" TargetName="border" Value="#FFC4E5F6"/> <Setter Property="BorderBrush" TargetName="border" Value="#FF2C628B"/> </Trigger>
しかし、こんな風にControlTemplateを書いてしまうと、どのOSで動かしてもこのWin8風デザインの表示になってしまう。
ちょっと、手軽に対処する方法が思いつかない。。。
ToggleButtonは、何か他のコントロールを作成する時のベースコントロールとするようなものなので、あまり使うことはないかもしれないけど、
Win8でToggleButtonを使うときには注意が必要ですね。