次のように定義されたボタンスタイルがあります。
<LinearGradientBrush x:Key="Brush_NavButtonBorder0" StartPoint="0,0" EndPoint="0,1" >
<GradientStop Color="#00383f47" Offset="0" />
<GradientStop Color="#FF383f47" Offset="1" />
</LinearGradientBrush>
<LinearGradientBrush x:Key="Brush_NavButtonBorder4" StartPoint="0,0" EndPoint="0,1" >
<GradientStop Color="#FF414f5a" Offset="0" />
<GradientStop Color="#11414f5a" Offset="1" />
</LinearGradientBrush>
<LinearGradientBrush x:Key="Brush_NavButtonBackground" StartPoint="0,0" EndPoint="0,1" >
<GradientStop Color="#FF3f505a" Offset="0" />
<GradientStop Color="#FF37454e" Offset="0.75" />
<GradientStop Color="#FF2f3c44" Offset="1" />
</LinearGradientBrush>
<LinearGradientBrush x:Key="Brush_NavButtonPressedBackground" StartPoint="0,0" EndPoint="0,1" >
<GradientStop Color="#FF3f505a" Offset="1" />
<GradientStop Color="#FF37454e" Offset="0.25" />
<GradientStop Color="#FF2f3c44" Offset="0" />
</LinearGradientBrush>
<Style x:Key="NavigationButton" TargetType="Button">
<Setter Property="FocusVisualStyle" Value="{x:Null}" />
<Setter Property="Foreground" Value="Gainsboro" />
<Setter Property="FontSize" Value="14" />
<Setter Property="Background" Value="{StaticResource Brush_NavButtonBackground}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}" x:Name="MainControlTemplate">
<Grid>
<Border x:Name="outerBorder" CornerRadius="5" BorderThickness="1" BorderBrush="{StaticResource Brush_NavButtonBorder0}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True" />
<Border Margin="1" CornerRadius="4" BorderThickness="1" BorderBrush="{StaticResource Brush_NavButtonBorder4}" Background="Transparent" SnapsToDevicePixels="True">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Name="content"/>
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<!--<Setter TargetName="outerBorder" Property="BorderBrush" Value="Gray" />-->
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetName="outerBorder"
Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[0].(GradientStop.Color)"
To="Gray"
Duration="0:0:0.2" />
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Background" Value="{StaticResource Brush_NavButtonPressedBackground}" />
<Setter TargetName="content" Property="RenderTransform" >
<Setter.Value>
<TranslateTransform X="2.0" Y="2.0" />
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Opacity" Value="0.5" />
</Trigger>
<Trigger Property="IsKeyboardFocused" Value="True">
<Setter Property="FocusVisualStyle" Value="{StaticResource MyFocusVisualStyle}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
このスタイルには 2 つの問題があります。 1. ボタンを MouseOver すると、このスタイルを使用する他のすべてのボタンが、上にあるボタンだけでなく、アニメーションに反応します。2. 0 番目のグラデーション ストップだけでなく、境界線全体の色をアニメーション化したいと考えていますが、これを行う方法が見つからないようです。
ColorAnimation セクションの上のコメント行は、灰色の BorderBrush を MouseOver ですぐに表示することを除いて、私が望むこととほとんど同じです - 灰色の BorderBrush をアニメーションで表示したいのです。
これはかなり単純なはずですが、これを行う方法がわかりません。これを正しい方法で行う方法を知っている人はいますか?