在WPF中设置矢量图像按钮的填充颜色动画

我使用以下XAML创建矢量图像按钮，并通过动画更改鼠标悬停时的不透明度。以下是按钮样式：-

<Style x:Key="IconButtonStyle" TargetType="Button">
    <Setter Property="Cursor" Value="Hand"/>
    <Setter Property="IsTabStop" Value="True" />
    <Setter Property="Focusable" Value="True" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border Background="Transparent">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal">
                                <Storyboard>                                       
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ContentPresenter">
                                        <EasingDoubleKeyFrame KeyTime="0" Value="1.0"/>
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ContentPresenter">
                                        <EasingDoubleKeyFrame KeyTime="0" Value="0.6"/>
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>

                    <ContentPresenter x:Name="ContentPresenter" 
                                      ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" 
                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                      Margin="{TemplateBinding Padding}" />
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

（在数据属性中指定的资源

MetroButtonRightGeometry

是一个

，由于大小原因，我在这里没有包括它）

我想更改序列图像板以改变图像的颜色，而不是其不透明度，但我似乎无法从序列图像板中访问

路径

的

填充

属性，或者在其当前形式中是否可能。有什么建议吗

更新

我找到了一个解决方案，将视觉状态故事板更改为使用关键帧的

彩色动画（注意TargetProperty！）：-

但是，必须包含填充（这基本上被忽略），并且只为storyboard TargetProperty提供一个“钩子”，这让人感觉有点不舒服。如果没有它，我会得到一个错误“'Fill'属性不指向路径“{0}.{1}.{2}”中的DependencyObject。
我想出了这个解决方案，它使用触发器而不是故事板。在控件模板中具有
路径
，也会产生更清晰的按钮标记。我使用按钮的
Content
属性指定图标，即应用于
路径的几何体

这似乎是可行的，但作为一个相对的WPF新手，我欢迎对我的解决方案发表评论

风格：-

<Style x:Key="IconButtonStyle" TargetType="Button">
    <Setter Property="Cursor" Value="Hand"/>
    <Setter Property="IsTabStop" Value="True" />
    <Setter Property="Focusable" Value="True" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border Background="Transparent" Padding="{TemplateBinding Padding}">
                    <Path x:Name="buttonPath" Fill="Blue" Style="{TemplateBinding Content}" />
                </Border>

                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter TargetName="buttonPath" Property="Fill" Value="Red"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>



用法示例：-

<Button Width="40" Height="40" Style="{StaticResource IconButtonStyle}" Content="{StaticResource MetroButtonRightStyle}" />


此外，当您使用
Fill=“{StaticResource SomeSolidBrush}”
时，该资源由使用它的所有路径共享。设置该对象的动画将设置所有按钮的路径颜色的动画。@Clemens-有趣的是，我不知道这样的事情是可能的。谢谢你的提醒。
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Button.Content).(Path.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="ContentPresenter">
    <EasingColorKeyFrame KeyTime="0" Value="Gold" />
</ColorAnimationUsingKeyFrames>

<Path Width="30" Height="30" Style="{StaticResource MetroButtonRightStyle}" Fill="{StaticResource SomeSolidBrush}" />

<Style x:Key="IconButtonStyle" TargetType="Button">
    <Setter Property="Cursor" Value="Hand"/>
    <Setter Property="IsTabStop" Value="True" />
    <Setter Property="Focusable" Value="True" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border Background="Transparent" Padding="{TemplateBinding Padding}">
                    <Path x:Name="buttonPath" Fill="Blue" Style="{TemplateBinding Content}" />
                </Border>

                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter TargetName="buttonPath" Property="Fill" Value="Red"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<Button Width="40" Height="40" Style="{StaticResource IconButtonStyle}" Content="{StaticResource MetroButtonRightStyle}" />