绑定故事板动画值

Question

我在一个视图模型上有一个枚举，它代表 5 种颜色中的一种，我正在使用 ValueConverter 将这些值转换为实际颜色。

特别是每个列表框项目的背景颜色在悬停时会更改。

我有一个带有可视状态管理器的自定义控件和一个鼠标悬停组，它使用 SplineColorKeyFrame 为悬停颜色设置动画（这是在控件模板的 xaml 中设置的）。自定义控件仅具有悬停颜色的依赖属性。

如果 SplineColorKeyFrame 的值来自资源，或者在 xaml 中设置为固定颜色，则此方法非常有用。但是，当我将值设置为“{TemplateBinding HoverColor}”时，它只是动画为透明

即使将 xaml 中的 DependencyProperty 设置为一种颜色，并尝试使用控件中的 TemplateBinding 来读取颜色也会导致问题，如果我告诉它从绑定中获取它，动画将不会使用正确的颜色或模板绑定。

我已经窥探了应用程序，可以看到依赖属性具有正确的值，但它似乎没有在动画中获取该值。

谁能建议如何解决这个问题？

这是我的控制模板：

<Style TargetType="{x:Type local:MyCustomControl}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:MyCustomControl}">
                <Border Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}" x:Name="border">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="MouseOverGroup">
                            <VisualStateGroup.Transitions>
                                <VisualTransition GeneratedDuration="0:0:0.2"/>
                            </VisualStateGroup.Transitions>
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="border">
                                        <SplineColorKeyFrame KeyTime="0" Value="{TemplateBinding HoverColor}" />
                                    </ColorAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Normal"/>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <VisualStateManager.CustomVisualStateManager>
                        <ic:ExtendedVisualStateManager/>
                    </VisualStateManager.CustomVisualStateManager>

                    <i:Interaction.Triggers>
                        <i:EventTrigger EventName="MouseEnter">
                            <ic:GoToStateAction x:Name="MouseOverAction" StateName="MouseOver"/>
                        </i:EventTrigger>
                        <i:EventTrigger EventName="MouseLeave">
                            <ic:GoToStateAction x:Name="NormalAction" StateName="Normal"/>
                        </i:EventTrigger>
                    </i:Interaction.Triggers>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

这是我的自定义控件代码：

   public class MyCustomControl : Control
    {
        public static DependencyProperty HoverColorProperty = DependencyProperty.Register("HoverColor", typeof (Color),
                                                                                          typeof (MyCustomControl));
        public Color HoverColor
        {
            get
            {
                return (Color)GetValue(HoverColorProperty);
            }
            set
            {
                SetValue(HoverColorProperty, value);
            }
        }

        static MyCustomControl()
        {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(MyCustomControl), new FrameworkPropertyMetadata(typeof(MyCustomControl)));
        }
    }

这是 xaml 的主窗口：

<Window x:Class="Test.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
        xmlns:Test="clr-namespace:Test" Title="MainWindow" Height="350" Width="525">
    <Window.DataContext>
        <Test:ViewModel/>
    </Window.DataContext>
    <Grid>
        <Test:MyCustomControl HoverColor="Yellow"
                              HorizontalAlignment="Center" VerticalAlignment="Center" Width="150" Height="150"
                              Background="Bisque">

        </Test:MyCustomControl>
    </Grid>
</Window>

Answer 1

我找到了这个问题的答案。事实证明，由于某种原因，如果 StoryBoard 在 Xaml 中内联，则绑定不起作用。如果您将 Storyboard 放在资源中并在 VisualStateManager 中引用该资源，那么一切正常。