WPF C#实现动画(速度、启停、缓动、线性渐变)
作者:互联网
该Demo使用是纯C#编写(不建议使用XAML做动画效果,内存开销不可控且不便操作)
效果:速度、启动、暂停、缓动效果、线性渐变
代码如下
using System;
using System.Text.RegularExpressions;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace MyWPF
{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
Storyboard sb;//故事板
Rectangle myRectangle;//故事板主角控件对象
string rectName = "MyRectangle";//故事板主角控件名
public MainWindow()
{
InitializeComponent();
this.Loaded += (s,e)=>InitData();
}
//初始化数据
private void InitData()
{
sb = new Storyboard();
myRectangle = new Rectangle()
{
Fill = Brushes.Red,
Height = 200,
Width = 200,
HorizontalAlignment = HorizontalAlignment.Left
};
myRectangle.Name = rectName;
this.RegisterName(myRectangle.Name, myRectangle);//使用C#插入控件时要注册控件名
ui_Grid.Children.Add(myRectangle);
}
//启动动画
private void Button_Click_1(object sender, RoutedEventArgs e)
{
//故事板动画Clear(等待GC),也可以手动设置为Null
sb.Children.Clear();
//边距位移动画
var marginAnim = new ThicknessAnimation
{
From = new Thickness(0, 0, 0, 0),
To = new Thickness(this.ActualWidth - 200, 0, 0, 0),
RepeatBehavior = RepeatBehavior.Forever,
EasingFunction = new BounceEase()
{
Bounces = 0,//反弹次数
EasingMode = EasingMode.EaseInOut,//缓动函数In Out
Bounciness = 0//反弹大小
}
};
//线性渐变动画
var colorAnim = new ColorAnimation
{
From = Colors.Red,
To = Colors.Blue,
RepeatBehavior = RepeatBehavior.Forever//重复播放
};
//设置故事板动画目标属性
Storyboard.SetTargetProperty(marginAnim, new PropertyPath(MarginProperty));
Storyboard.SetTargetProperty(colorAnim, new PropertyPath("(Fill).(SolidColorBrush.Color)"));
//将配置完毕的动画插入到故事板
sb.Children.Add(marginAnim);
sb.Children.Add(colorAnim);
if (!Regex.IsMatch(ui_Speed.Text, @"^[+-]?\d*[.]?\d*$"))
return;
//故事板运行速度
sb.SpeedRatio = Convert.ToDouble(ui_Speed.Text);
//故事板启动
sb.Begin(myRectangle, true);
}
//停止动画
private void Button_Click_2(object sender, RoutedEventArgs e)
{
//故事板停止
sb.Stop(myRectangle);
}
}
}
可能有同学会问new PropertyPath("(Fill).(SolidColorBrush.Color)")为什么要这样写,因为Fill依赖属性本身是Brushes类型。
MSDN上是这样说的:
例如,面板的Background属性是来自主题模板的完整画笔(实际上是SolidColorBrush )。要完全为Brush设置动画,需要有一个 BrushAnimation(可能每个Brush类型都有一个),并且没有这样的类型。要为画笔设置动画,您可以为特定画笔类型的属性设置动画。您需要从SolidColorBrush到它的Color才能在其中应用ColorAnimation。此示例的属性路径为.Background.Color
For instance, the Background property of a Panel is a complete Brush (actually a SolidColorBrush) that came from a theme template. To animate a Brush completely, there would need to be a BrushAnimation (probably one for every Brush type) and there is no such type. To animate a Brush, you instead animate properties of a particular Brush type. You need to get from SolidColorBrush to its Color to apply a ColorAnimation there. The property path for this example would be Background.Color.
关于PropertyPath XAML语法请看:https://docs.microsoft.com/en-us/dotnet/desktop/wpf/advanced/propertypath-xaml-syntax?view=netframeworkdesktop-4.8
关于更多故事板Storyboard资料请看:https://docs.microsoft.com/en-us/dotnet/desktop/wpf/graphics-multimedia/storyboards-overview?view=netframeworkdesktop-4.8
标签:动画,sb,C#,System,myRectangle,启停,new,using,WPF 来源: https://www.cnblogs.com/Stay627/p/15857785.html