[WPF] ボタンの「マウスオーバーで背景色を変更する」時の範囲をコンテント以外にも適用したい。

前提・実現したいこと

下の画像で「Add」と表記されている部分にカーソルを当てると背景色が変更されます。

しかし、コンテントの範囲外だと変更されません。

これをControlTemplateでコンテントの範囲外でも背景色が変更されるようにしたいです。

該当のソースコード

ボタンに適用しているスタイル

XAML
1        <Style TargetType="Button" x:Key="NormalButtonStyle" BasedOn="{StaticResource {x:Type Button}}">
2            <Style.Setters>
3                <Setter Property="Width" Value="40"/>
4                <Setter Property="Height" Value="30"/>
5                <Setter Property="Foreground" Value="White"/>
6                <Setter Property="Template">
7                    <Setter.Value>
8                        <ControlTemplate TargetType="Button">
9                            <Border x:Name="Border"                                
10                                    CornerRadius="8">
11                                <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center"/>
12                            </Border>
13                            <ControlTemplate.Triggers>
14                                <Trigger Property="IsMouseOver" Value="True">
15                                    <Setter Property="Background" Value="#888888" TargetName="Border"/>
16                                </Trigger>
17                                <Trigger Property="IsPressed" Value="True">
18                                    <Setter Property="Background" Value="#424242" TargetName="Border"/>
19                                </Trigger>
20                            </ControlTemplate.Triggers>
21                        </ControlTemplate>
22                    </Setter.Value>
23                </Setter>
24            </Style.Setters>
25        </Style>

ボタンのコード

XAML
1<Button Content="Add" Width="Auto" Style="{StaticResource NormalButtonStyle}">
2        <!--<Label Content="Add" Width="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Button}, Path=ActualWidth}" Foreground="White" HorizontalContentAlignment="Center"/>-->
3</Button>

試したこと

「ボタンのコード」でコメントアウトされているラベルを使用した場合は、コンテント以外でもマウスオーバーが働いたので、ContentPresenter辺りをどうにかすればいい気がするのですが、具体案が思いつきません。

できればLabelなどを使わずスタイルだけで実現したいのですが、何かいい方法はないでしょうか？

補足情報（FW/ツールのバージョンなど）

Visual Studio 2017
Wpf

行動規範の内容に同意します

回答1件

ベストアンサー

こんなのでしょうか？

XAML
1<Style TargetType="Button" x:Key="NormalButtonStyle" BasedOn="{StaticResource {x:Type Button}}">
2    <Style.Setters>
3        <Setter Property="Width" Value="100"/>
4        <Setter Property="Height" Value="30"/>
5        <Setter Property="Foreground" Value="White"/>
6        <Setter Property="Template">
7            <Setter.Value>
8                <ControlTemplate TargetType="Button">
9                    <Border x:Name="Border"
10                            Background="{TemplateBinding Background}"
11                            CornerRadius="8">
12                        <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center"/>
13                    </Border>                            
14                </ControlTemplate>
15            </Setter.Value>
16        </Setter>
17    </Style.Setters>
18    <Style.Triggers>
19        <Trigger Property="IsMouseOver" Value="True">
20            <Setter Property="Background" Value="#888888"/>
21        </Trigger>
22        <Trigger Property="IsPressed" Value="True">
23            <Setter Property="Background" Value="#424242"/>
24        </Trigger>
25    </Style.Triggers>
26</Style>