flash as2简易教程第3篇：缓冲运动

作者佚名技术来源服务器技术浏览发布时间 2012-07-07

现在大家应该都会使用AS程序让影片剪辑动起来了。但是你按照我教你的方法做来做去，一定做得很郁闷，为什么呢？别人的Flash看起来又流畅，又优雅，又漂亮，动起来那个好看啊，可是我的FLASH为什么动起来直不楞登的，活像机器人呢？算了，算了，别郁闷了，我还是告诉你吧，虽然咱们现在已经学会了用程序使FLASH动起来，但这只是FLASH程序动画得罪最基础的皮毛而已，就像刚刚学会走路的小孩，你还指望他能跳芭蕾？要使动画能够流畅、优雅的动起来，你还得埋头苦学才成。

优秀的FLASH动画中，影片剪辑的移动为什么看起来更流畅呢？因为它更符合生活中的运动规律，说白了两个字——缓冲。想一想汽车是怎么停下来的，速度逐渐减慢，然后停下来。任何事物在改变运动状态的时候，都是逐渐加速或者逐渐减速的，所以，要想你的动画看起来好看，你必须让动画学会缓冲才行。

先从减速运动开始。

何谓匀速运动？何为减速运动？

匀速运动，物理上来讲，就是单位时间内物体位移的值相等。而在flash里来说的话，就是每一帧里，影片剪辑的某一个属性值变化的幅度相等。拿上一次提到的代码来看：

myMc._x=0;
onEnterFrame=function(){
myMc._x += 1;
}

复制代码可以看到，在每一帧里，影片剪辑的x轴坐标增加了1，如果你觉得他慢吞吞得很不来劲，可以把这个值改大点，比如说改成10，

myMc._x=0;
onEnterFrame=function(){
myMc._x += 10;
}

复制代码运动速度果然快了很多，但是很抱歉，好像还是匀速的。所以，如果每帧中的数值保持不变，运动一定是匀速的。那么什么是减速运动呢？物理上来讲，就是单位时间内物体位移的值逐渐减小，最后变成零，物体就停下来了。所以，说到这里，冰雪聪明的你一定迫不及待的要举手发言了。

对了，所谓减速运动，在flash里，实现的方法就是让这个值逐渐减小，最后变成零就行了。到了这里，我们可以隆重推出我们的减速运动的公式了，看仔细了，如果你希望影片剪辑逐渐减速，到x轴坐标为500的时候停下来，那么，这样来写：

myMc._x=0;
onEnterFrame=function(){
myMc._x += (500-myMc._x)/10;
}

复制代码看明白了吗？没看明白得让你的大脑充分转动起来，想一想(500-myMc._x)/10是如何越变越小的。

好了，到这儿你是不是想明白了？
什么？还没有想明白，那就看下面的说明吧，想明白了的人，下面一段可以华丽的掠过了。
(500-myMc._x)/10中，10这个数字是可以随便写的，只要是正整数就行，当然写不同的数值，缓动的效果不一样。好奇的同学可以自己试一下。

我们来把循环分解，看一下这个值是如何逐步变小的。

myMc._x的初始值是1，所以，第一次循环时，括号中的数字是500，500/10，得到50，然后把50赋给myMc._x，也就是说第一帧中，myMc向右侧移动了50个像素，同时在第二次循环开始时，变成了50，这样，括号里(500-myMc._x)的值就变成了450，450/10是45，依次计算下去，你会发现这个值逐渐减小了。所以，mc的运动速度就逐渐减慢了，直到它越来越接近目标点500，这个值就越来越小，最后无限趋近于零，运动就停下来了。这就是缓动的减速运动原理。

用上这个东西以后，再去看看你的动画，是不是好看多了。其实加速运动是一样的，这里就不讲了，自己琢磨一下吧。当然，还有一个事情需要提醒一下，就是上次我们提到的，在onEnterFrame停止的时候，一定要记得清除掉循环，避免一直占用CPU资源。

myMc._x=0;
onEnterFrame=function(){
myMc._x += (500-myMc._x)/10;
if(Math.abs(500-myMc._x)<0.5){
delete this.onEnterFrame;
myMc._x=500;
}
}

复制代码 Math.abs是对括号里的数字取绝对值，因为500-myMc._x永远不可能达到零，所以，我们只能取一个极为接近0的数字，比如说0.5，基本上从视觉上已经看不出它的位置上差别。所以，这个时候我们把循环清除掉，并且直接赋值给myMc._x就可以了。

这就是所谓的缓冲运动，当然在实际的flash里还有很多更复杂的运动形式，比如说钟摆式的运动，回弹运动等等，里边的有些运动方式，flash里提供一些现成的类可以方便地实现效果。关于这些缓动类的使用，我们下次再谈。

有问题的可以到我的博客（http://www.cnblogs.com/nethinks）或者加QQ群（46428099）进行交流。关键词：

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!

分享到：更多

你可能对下面的文章感兴趣

上一篇: 设置PNG非透明区域为mask区域下一篇: 动画形变讨论2：低头

关于flash as2简易教程第3篇：缓冲运动的所有评论

随机推荐