画笔到画笔动画

我设法找到了如何制作 WPF 动画 - 两种颜色之间的过渡。

它被称为 ColorAnimation 并且效果很好。

ColorAnimation animation = new ColorAnimation
{
    From = Colors.DarkGreen,
    To = Colors.Transparent,
    Duration = new Duration(TimeSpan.FromSeconds(1.5)),
    AutoReverse = false
};
animation.Completed += new EventHandler(animation_Completed);
SolidColorBrush brush = new SolidColorBrush(Colors.Transparent);
animation.AccelerationRatio = 0.5;

Background = brush;
brush.BeginAnimation(SolidColorBrush.ColorProperty, animation);

我正在使用它来为我的用户控件的背景设置动画。我的控件背景是SolidColorBrush。最近我改为LinearGradientBrush。现在我不能再使用我的动画了。

我需要从画笔到画笔的动画，而不是颜色到颜色的动画。最好的选择是抽象画笔类型，其中包括纯色、线性渐变等，因此我可以例如从SolidColorBrush to LinearGradientBrush。这可能吗？谢谢。

另一种可能的方法是创建一个为画笔设置动画的自定义动画类。 我找到了一种简单的方法来做到这一点，通过创建一个类，派生自AnimationTimeline https://msdn.microsoft.com/en-us/library/system.windows.media.animation.animationtimeline.aspx。我们可以重写自定义类中的一些成员，其中包括AnimationTimeline.GetCurrentValue method https://msdn.microsoft.com/de-de/library/system.windows.media.animation.animationtimeline.getcurrentvalue.aspx。它返回一个取决于动画进度以及开始值和结束值的值。

最简单的方法是创建一个VisualBrush并将开始值与结束值交叉淡入淡出Opacity子控件上的属性。结果是一个如下所示的类：

public class BrushAnimation : AnimationTimeline
{
    public override Type TargetPropertyType
    {
        get
        {
            return typeof(Brush);
        }
    }

    public override object GetCurrentValue(object defaultOriginValue,
                                           object defaultDestinationValue,
                                           AnimationClock animationClock)
    {
        return GetCurrentValue(defaultOriginValue as Brush,
                               defaultDestinationValue as Brush,
                               animationClock);
    }
    public object GetCurrentValue(Brush defaultOriginValue,
                                  Brush defaultDestinationValue,
                                  AnimationClock animationClock)
    {
        if (!animationClock.CurrentProgress.HasValue)
            return Brushes.Transparent;

        //use the standard values if From and To are not set 
        //(it is the value of the given property)
        defaultOriginValue = this.From ?? defaultOriginValue;
        defaultDestinationValue = this.To ?? defaultDestinationValue;

        if (animationClock.CurrentProgress.Value == 0)
            return defaultOriginValue;
        if (animationClock.CurrentProgress.Value == 1)
            return defaultDestinationValue;

        return new VisualBrush(new Border()
        {
            Width = 1,
            Height = 1,
            Background = defaultOriginValue,
            Child = new Border()
            {
                Background = defaultDestinationValue,
                Opacity = animationClock.CurrentProgress.Value,
            }
        });
    }

    protected override Freezable CreateInstanceCore()
    {
        return new BrushAnimation();
    }

    //we must define From and To, AnimationTimeline does not have this properties
    public Brush From
    {
        get { return (Brush)GetValue(FromProperty); }
        set { SetValue(FromProperty, value); }
    }
    public Brush To
    {
        get { return (Brush)GetValue(ToProperty); }
        set { SetValue(ToProperty, value); }
    }

    public static readonly DependencyProperty FromProperty =
        DependencyProperty.Register("From", typeof(Brush), typeof(BrushAnimation));
    public static readonly DependencyProperty ToProperty =
        DependencyProperty.Register("To", typeof(Brush), typeof(BrushAnimation));
}

您可以像往常一样在 XAML 中使用它：

<EventTrigger RoutedEvent="Loaded">
    <BeginStoryboard>
        <Storyboard >
            <local:BrushAnimation Storyboard.TargetName="border"
                                  Storyboard.TargetProperty="Background" 
                                  Duration="0:0:5" From="Red" 
                                  RepeatBehavior="Forever" AutoReverse="True" >
                <local:BrushAnimation.To>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#FF00FF2E" Offset="0.005"/>
                        <GradientStop Color="#FFC5FF00" Offset="1"/>
                        <GradientStop Color="Blue" Offset="0.43"/>
                    </LinearGradientBrush>
                </local:BrushAnimation.To>
            </local:BrushAnimation>
        </Storyboard>
    </BeginStoryboard>
</EventTrigger>

或者在后面的代码中：

var animation = new BrushAnimation
{
    From = Brushes.Red,
    To = new LinearGradientBrush (Colors.Green, Colors.Yellow, 45),
    Duration = new Duration(TimeSpan.FromSeconds(5)),
};
animation.Completed += new EventHandler(animation_Completed);
Storyboard.SetTarget(animation, border);
Storyboard.SetTargetProperty(animation, new PropertyPath("Background"));

var sb = new Storyboard();
sb.Children.Add(animation);
sb.Begin();

也可以延长BrushAnimation具有构造函数重载等，因此它看起来像 .NET 给定的动画类型。