Tags标签 网战地图
当前位置: 主页 > 网站建设 > silverlight教程 >

Expression Blend实例中文教程(10) - 缓冲动画快速入门Easing

2012-03-30 10:36 [silverlight教程] 来源于:
导读:随着Rich Internet application(RIA)应用技术的发展,各个公司越来越注重于项目的用户体验性 ,在保证其功能完善,运行稳定的基础上,绚丽的UI和人性化的操作

随着Rich Internet application(RIA)应用技术的发展,各个公司越来越注重于项目的用户体验性 ,在保证其功能完善,运行稳定的基础上,绚丽的UI和人性化的操作设计会给用户带来舒适的体验效果。 前文我们学习了Blend设计简单的动画,可以使用StoryBoard快速创建一个动画效果,但是该动画效果看 起来缺乏自然效果,让用户感觉太过机械化,大大的降低了用户体验性。为了是动画更为人性化,看起来 更自然化,我们可以通过以下两个方式来解决:

方法1. 使用前文所提及的,帧动画技术,为了是动画更自然化,可以在动画的关键细节中添加更多的 帧,缩短每帧之间间隔效果,这样可以提高动画效果,但是,对于大型项目来说,这样的设计会耗费很多 的精力设计,在项目完成后,项目维护相对复杂,一旦设计有所改动,需要全面修改其动画效果代码,所 以,相对来说,该方法不太实用;

方法2. 在Silverlight 3中,微软推出一个新的功能-Animation Easing,也称为缓冲动画。微软将 11种常用的动画效果封装,开发人员和设计人员可以轻松调用,通过Animation Easing创建更自然化的动 画效果。本文将详细介绍Animation Easing缓冲动画的入门知识,以及如何使用Blend设计Easing。

理解Animation Easing(缓冲动画)

在Silverlight中每个功能都会继承自不同的基类,实现不同的功能效果,Animation Easing(缓冲动 画)也是一样,继承自EasingFunctionBase基类,在该类中,提供了一个属性EasingMode,通过该属性可 以控件缓冲动画效果模式。Animation Easing(缓冲动画)效果模式被封装成一个枚举类型,分别是 EaseIn,EaseOut,EaseInOut.Animation Easing(缓冲动画)的效果模式是一个重要的概念,该属性直接 决定Animation Easing(缓冲动画)会在什么时候产生效果。这里我不想用过于官方的解释来说明这三种 模式,根据我的使用体验,用自己的语言描述一下这三种动画模式的概念,EaseIn, 简单的可以理解为将 该缓冲动画效果应用在动画实例开始,也就是一开始动画,马上执行该Animation Easing(缓冲动画)效 果;

EaseOut,简单的可以理解为将该缓冲动画效果应用在动画实例结束,也就是要结束动画前,马上执行 该Animation Easing(缓冲动画)效果;

EaseInOut,简单的可以理解为将动画的全过程平均分为两部分,该缓冲动画效果应用在第一部分,分 别将 EaseIn应用在第一部分的开始,EaseOut应用在第二部分的结束。例如,有个10秒的动画,被应用 EaseInOut模式,Silverlight会将该动画平分为两个5秒的动画,将EaseIn应用在第一个5秒动画的开始, 然后将EaseOut在第二个5秒动画结束前应用。

对于三个效果模式的理解,我们将在后文实例中进行演示说明,这里仅需先对Animation Easing(缓 冲动画)有个基础概念。作为软件设计人员和开发人员,应该都明白,所谓的动画效果,其实是计算机对 于图形运行轨迹的计算不同,所产生的不同的视觉效果。而Animation Easing(缓冲动画)也是同理,在 微软提供的11种Animation Easing(缓冲动画)动画中,运行了11个不同的方程式,从而产生11种动画效 果。为了随后更好的理解这11种Animation Easing(缓冲动画)效果,首先需要了解一下最基础的方程式 ,通过方程式图形,可以大概明白动画运行效果。

上图的t是表示时间,而f(t)表示动画目标对象属性,曲线表示其动画轨迹效果,不同的时间段,对象 属性不同。

看个例子说明,方程式图形效果,

(编辑:)

本文标签:
网友评论

栏目列表

推荐文章