笔刷到画笔动画
笔刷到画笔动画
提问于 2011-11-12 00:17:34
我设法找到了如何在两种颜色之间进行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。现在我不能再使用我的动画了。
我需要从画笔到画笔的动画，而不是颜色到颜色。最好的选择是抽象笔刷类型，它包括SolidColor，LinearGradient等，所以我可以从SolidColorBrush到LinearGradientBrush等动画。这有可能吗？谢谢。
回答 3
Stack Overflow用户
发布于 2015-04-16 03:58:26
另一种可能的方法是，创建一个自定义动画类，使笔刷具有动画效果。我找到了一种简单的方法，就是创建一个派生自AnimationTimeline的类。我们可以覆盖自定义类中的一些成员，其中包括AnimationTimeline.GetCurrentValue method。它根据动画进度以及开始和结束值返回一个值。
最简单的方法是创建一个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给定的动画类型。
Stack Overflow用户
发布于 2011-11-12 01:27:40
你只需要在渐变笔刷的渐变色标上使用颜色动画。这是一个使用故事板制作矩形渐变动画的示例。
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="GradientBrushAnimation.MainWindow"
x:Name="Window"
Title="MainWindow"
Width="640" Height="480">
<Window.Resources>
<Storyboard x:Key="Storyboard1">
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="rectangle">
<EasingColorKeyFrame KeyTime="0:0:2" Value="Red"/>
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="rectangle">
<EasingColorKeyFrame KeyTime="0:0:2" Value="#FF71FF00"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</Window.Resources>
<Window.Triggers>
<EventTrigger RoutedEvent="FrameworkElement.Loaded">
<BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
</EventTrigger>
</Window.Triggers>
<Grid x:Name="LayoutRoot">
<Rectangle x:Name="rectangle" Margin="78,102,292,144" Stroke="Black">
<Rectangle.Fill>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
</Grid>
</Window>Stack Overflow用户
发布于 2013-10-30 22:17:15
如果在模板样式中为填充画笔指定了名称，则可以为画笔颜色设置动画效果，如下所示：
<Rectangle Width="100" Height="100">
<Rectangle.Fill>
<SolidColorBrush x:Name="MyAnimatedBrush" Color="Orange" />
</Rectangle.Fill>
<Rectangle.Triggers>
<!-- Animates the brush's color to gray
When the mouse enters the rectangle. -->
<EventTrigger RoutedEvent="Rectangle.MouseEnter">
<BeginStoryboard>
<Storyboard>
<ColorAnimation
Storyboard.TargetName="MyAnimatedBrush"
Storyboard.TargetProperty="Color"
To="Gray" Duration="0:0:1" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Rectangle.Triggers>
</Rectangle>摘自MSDN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/8096852
复制相关文章
相似问题