基于C#WPF框架——动画

WPF提供了一个更高级的模型,经过该模型能够只关注动画的定义,而没必要考虑它们的渲染方式。这个模型基于依赖项属性基础架构。本质上,WPF动画只不过是在一段时间间隔内修染方式。这个模型基于依赖项属性基础架构。本质上,WPF动画只不过是在一段时间间隔内修改依赖项属性值的一种方式。架构

尽管目前WPF可为动画使用三种方法(线性插值、关键帧以及路径),但彻底也能够建立更多的使用彻底不一样的方式来修改值的动画类.惟一要求是自定义的动画类必须根据时间修改值。
多的使用彻底不一样的方式来修改值的动画类.惟一要求是自定义的动画类必须根据时间修改值。动画

Animation 类

全部动画类都以“类型名+Animation”方式命名。这种观点很接近实际状况,但不是很是准确。code

  • 17个“类型名+Animation”类,这些类使用==插值==。
  • 22 个“类型名+AnimationUsingKeyFrames"类,这些类使用==关键帧动画==。
  • 3个“类型名+AnimationUsingPath"类,这些类使用==基于路径==的动画。
    全部这些动画类都继承自抽象的“类型名+AnimationBase”类,这些基类实现了一些基本功能,从而为建立自定义动画类提供了快捷方式。若是某个数据类型支持多种类型的动画,那么全部的动画类都继承自抽象的动画基类。orm

    这42个类并非System.Windows.Media.Animation名称空间中的惟- -内容。每一个关键帧动画还使用本身的关键帧类和关键帧集合类,这两部分类会致使一些混乱。 总之,在==System.Windows.Media.Animation==名称空间中有100多个类。对象

BooleanAnimationUsingKeyFrames ByteAnimation
ByteAnimationUsingKeyFrames CharAnimationUsingKeyFrames
ColorAnimation ColorAnimationUsingKeyFrames
DecimalAnimation DecimalAnimationUsingKeyFrames
DoubleAnimation DoubleAnimationUsingKeyFrames
DoubleAnimationUsingPath Int16Animation
Intl 6AnimationUsingKeyFrames Int32Animation
Int32AnimationUsingKeyFrames Int64Animation
Int64AnimationUsingKeyFrames MatrixAnimationUsingKeyFrames
MatrixAnimationUsingPath ObjectAnimationUsingKeyFrames .
PointAnimation PointAnimationUsingKeyFrames
PointAnimationUsingPath Point3DAnimation
Point3DAnimationUsingKeyFrames QuarternionAnimation
QuarternionAnimationUsingKeyFrames RectAnimation
RectAnimationUsingKeyFrames Rotation3DAnimation
Rotation3DAnimationUsingKeyFrames SingleAnimation
SingleAnimationUsingKeyFrames SizeAnimation
SizeAnimationUsingKeyFrames StringAnimationUsingKeyFrames
ThicknessAnimation ThicknessAnimationUsingKeyFrames
VectorAnimation VectorAnimationUsingKeyFrames
Vector3DAnimation Vector3DAnimationUsingKeyFrames

这42个类开不是System. Windows.Media.Animation名称空间中的惟一内 谷.每一个关键帧动画
还使用本身的关键帧类和关键帧集合类,这两部分类会致使一些混乱。总之,在System.Windows.
Media.Animation名称空间中有100多个类。blog

任何使用线性插值的动画最少须要三个细节:
==开始值(From)==、==结束值(To)==和==整个动画执行的时间(Duration)==。
即便不使用To属性,也可使用By属性。By属性用于建立按设置的数量改变值的动画,而不是按给定目标改变值。
可结合使用By和From属性,但这并不会减小任何工做. By值被简单地增长到From值上,使其达到To值。
大部分使用插值的动画类一般都提供了By属性,但并不是所有如此。例如,对于非数值数据类型来讲,By 属性是没有意义的,好比ColorAnimation类使用的Color结构。
另有一种方法可获得相似的行为,而不须要使用By属性一可通 过设置IsAdditive属性建立增长数值的动画。当建立这种动画时,当前值被自动添加到From值和To值。继承

动画的生命周期

单向动画(如增加按钮的动画)在运行结束后会保持处于活动状态,这是由于动画须要将按钮的宽度保持为新值。这会致使以下不常见的问题一如 果尝试使用代码在动画完成后修改属性值,代码将不起做用。由于代码只是为属性指定了一个新的本地值,但仍会优先使用动画以后的属性值。
根据准备完成的工做,可经过以下几种方法解决这个问题:
● 建立将元素 从新设置为原始状态的动画。可经过建立不设置To属性的动画达到该目的。
例如,将按钮的宽度减少到最后设置的尺寸的按钮缩小动画,以后就可使用代码改变该属性了。
●建立可翻转的动画。经过将AutoReverse属性设置为true 来建立可翻转的动画。例如,当按钮增-长动画再也不增长按钮的宽度时,将反向播放动画,返回到原始宽度。动画的总持续时间也将翻倍。
●改变FillBehavior属性。一般,FillBehavior 属性被设置为HoldEnd,这意味着当动画结束时,会继续为目标元素应用最后的值。若是将FillBehavior 属性改成Stop,只要动画结束,属性就会恢复为原来的值。
●当动画完成时经过处理动画对象的Completed事件删除动画对象。
前3种方法改变了动画的行为。无论使用哪一种方法,它们都将动画后的属性设置为原来的数值。若是这并不是所但愿的,那就须要使用最后-种方法。
首先,在启动动画前,关联事件处理程序以响应动画完成事件:
widthAnimation. Completed += animation_ Completed;
==注意:==
Completed事件是常规的.NET事件,使用常规的没有附加信息的EventArgs 对象。该事件不是路由事件。生命周期

Timeline类
名称 说明
BeginTime 设置将被添加到动画开始以前的延迟时间(TimeSpan类型)。这一-延迟时间被加到总时间,因此具备5秒延迟的5秒动画,总时间是10秒。当同步在同一时间开始,但按顺序应用效果的不一样动画时,BeginTime 属性是颇有用的
Duration 使用Duration对象设置动画从开始到结束的运行时间
SpeedRatio 提升或减慢动画速度。一般,SpeedRatio 属性值是1。若是增长该属性值,动画会加快(例如,若是SpeedRatio属性的值为5,动画的速度会变为原来的5倍);若是减少该属性值,动画会变慢(例如,若是SpeedRatio属性的值为0.5,动画时间将变为原来的两倍)。可经过改变更画的Duration属性值获得相同结果。当应用BeginTime 延迟时,不考虑SpeedRatio属性的值
AccclerationRatio;DecelerationRatio 使动画不是线性的,从而开始时较慢,而后增速(经过增长AcelerationRatio 属性值):或者结束时下降速度(经过增长DecelerationRatio属性值)。这两个属性的值都在0~1之间,而且开始时都设置为0。此外,这两个属性值之和不能超过1
AutoReverse 若是为true,当动画完成时会自动反向播放,返回到原始值。这也会使动画的运行时间加倍。若是增长SpeedRatio属性值,就会应用到最初的动画播放以及反向的动画播放。BeginTime属性值只应用于动画的开始一不 延迟反向动画
FillBehavior 决定当动结束时如何操做。一般,可将属性值保持为固定的结束值(FillBchavior. HoldEnd),可是也可选择将属性值返回为原来的数(FillBehavior Stop)
RepeatBehavior 经过该属性,可使用指定的次数或时间间隔重复动画。用于设置这个属性的RepeatBehavior对象决定了确切的行为
故事板

在全部声明式动画中都会用到以下两个要素:
故事板: 故事板是BeginAnimation( )方法的XAML等价物。经过故事板将动画指定到合适的元素和属性。
事件触发器: 事件触发器响应属性变化或事件(如按钮的Click事件),并控制故事板。例如,为了开始动画,事件触发器必须开始故事板。
小案例:
在这里插入图片描述事件

以上小案例为点单击按钮时,原形先向右移动到达To值后继续向左移动,矩形向右下角移动,当到达To值后原路返回向左上角移动,此动画为重复执行动画图片

首先须要引入动画类命名空间;

using System.Windows.Media.Animation;

建立故事板:

Storyboard sto = new Storyboard(); // 故事板
        Storyboard stt = new Storyboard(); // 向下故事板

初始化图形大小,位置:

Border bod = new Border(); // 圆形
            bod.Width = 100;
            bod.Height = 100;
            bod.BorderThickness =new Thickness(10); // 设置原形边框厚度
            bod.BorderBrush = Brushes.Yellow; // 边框颜色
            bod.Background = Brushes.Purple; // 圆形背景色
            bod.CornerRadius = new CornerRadius(50); // 画圆
            BG.Children.Add(bod);
            Border boo = new Border(); // 矩形
            boo.Width = 100;
            boo.Height = 100;
            boo.Background = Brushes.Cyan;
            Canvas.SetLeft(boo, 100);
            Canvas.SetTop(boo, 300);
            boo.CornerRadius = new CornerRadius(20);
            BG.Children.Add(boo);

动画情节:

DoubleAnimation move = new DoubleAnimation(); // 移动情节
            move.From = 0; // 初始值
            move.To = 400; // 结束值
            move.Duration = new Duration(new TimeSpan(0, 0, 0, 3, 0)); // 须要的时间
            move.AutoReverse = true; // 设置成返回
            move.RepeatBehavior = RepeatBehavior.Forever; // 重复执行
            Storyboard.SetTarget(move,bod); // 情节添加给对象
            //Storyboard.SetTargetProperty(move, new PropertyPath(Canvas.LeftProperty)); // 改变lef位置
            Storyboard.SetTargetProperty(move, new PropertyPath("(Canvas.Left)"));
            sto.Children.Add(move);

            ColorAnimation bianSe = new ColorAnimation(Colors.Purple,Colors.Orange,TimeSpan.FromMilliseconds(300)); // 改背景色情节
            Storyboard.SetTarget(bianSe, bod);
            Storyboard.SetTargetProperty(bianSe, new PropertyPath("(Border.Background).(SolidColorBrush.Color)"));
            sto.Children.Add(bianSe);

            ColorAnimation biankuSe = new ColorAnimation(Colors.Blue, Colors.DarkViolet,TimeSpan.FromSeconds(3));  // 改变边框颜色
            Storyboard.SetTarget(biankuSe, bod);
            Storyboard.SetTargetProperty(biankuSe, new PropertyPath("(Border.BorderBrush).(SolidColorBrush.Color)"));
            sto.Children.Add(biankuSe);

            ThicknessAnimation kuang=new ThicknessAnimation(new Thickness(10),new Thickness(20),TimeSpan.FromMilliseconds(30));  // 改变边框厚度
            Storyboard.SetTarget(kuang, bod);
            Storyboard.SetTargetProperty(kuang, new PropertyPath("BorderThickness"));
            sto.Children.Add(kuang);

            DoubleAnimation zhuan = new DoubleAnimation(0, 360, new Duration(TimeSpan.FromSeconds(3))); // 旋转情节
            Storyboard.SetTarget(zhuan, bod);
            zhuan.AutoReverse = true;
            zhuan.RepeatBehavior = RepeatBehavior.Forever;
            Storyboard.SetTargetProperty(zhuan, new PropertyPath("RenderTransform.Angle"));
            sto.Children.Add(zhuan);
            RotateTransform xuanZhuan = new RotateTransform(); // 旋转对象
            bod.RenderTransform = xuanZhuan;
            bod.RenderTransformOrigin = new Point(0.5,0.5);

            // 控制boo  向下移动并 旋转
            DoubleAnimation yidong = new DoubleAnimation();// 移动右
            yidong.From = 0;
            yidong.To = 500;
            yidong.Duration = new Duration(TimeSpan.FromSeconds(3)); // 设置毫秒数
            yidong.AutoReverse = true; // 返回原路
            yidong.RepeatBehavior = RepeatBehavior.Forever; // 重复执行
            Storyboard.SetTarget(yidong, boo);
            Storyboard.SetTargetProperty(yidong, new PropertyPath("(Canvas.Left)"));
            stt.Children.Add(yidong);
            DoubleAnimation yidong_ = new DoubleAnimation(Canvas.GetTop(boo),(Canvas.GetTop(boo)+400),new Duration(TimeSpan.FromSeconds(3))); // 移动下
            yidong_.AutoReverse = true;
            yidong_.RepeatBehavior = RepeatBehavior.Forever;
            Storyboard.SetTarget(yidong_, boo);
            Storyboard.SetTargetProperty(yidong_,new PropertyPath("(Canvas.Top)"));
            stt.Children.Add(yidong_);
            DoubleAnimation xiazhuan = new DoubleAnimation(0, 360, new Duration(TimeSpan.FromSeconds(3))); //旋转情节
            Storyboard.SetTarget(xiazhuan, boo);
            xiazhuan.AutoReverse = true; //可原路返回
            xiazhuan.RepeatBehavior = RepeatBehavior.Forever;// 重复执行
            Storyboard.SetTargetProperty(xiazhuan, new PropertyPath("RenderTransform.Angle"));
            stt.Children.Add(xiazhuan);
            RotateTransform xuanzhuan = new RotateTransform(); // 旋转对象
            boo.RenderTransform = xuanzhuan;
            boo.RenderTransformOrigin = new Point(0.5, 0.5);

点击按钮:

private void btn_Click(object sender, RoutedEventArgs e)
        {
            sto.Begin(); // 开启动画
            stt.Begin();
        }
相关文章
相关标签/搜索