学院首页>图形图像>FLASH>Flash 特效步步高(七)——跟踪鼠标的重力效果作

Flash 特效步步高(七)——跟踪鼠标的重力效果作

作者:施叶楠 来源:Chinabite 添加时间:2006-5-21 11:55:47
 注:由于本文属于高级教程,因此没有太多的图片解释。文中一些较简单的细节假定您已熟悉,文中将只提供制作过程中用到的Actionscript源码及需要知道的一些有关于重力的基本概念。   1. 按Ctrl+F8创建一个名为"button drag"的属性为Button的Symble;   2. 在这个Button Symble里面的第四个状态:Hit里,在正中画一个小圆圈;   3. 回到主Moive里,在第一个Keyframe里,将这个Symble从Library里拖放到里面;   4. 用鼠标选中这个Symble,从菜单选insert > convert to symbol,将它的属性转化为movie,并命名为drg1;   5. 将这个Symble的Instance name取名为 drg1;   6. 在这个Keyframe里加入Actionscript: Start Drag ("/drg1", lockcenter)。这会在Moive开始播放时将这个‘隐藏’按纽锁定在按纽的中央;   7. 创建一个新的名为‘Spinner’的Layer;   8. 在这个layer的第三个keyframe里创建一个新的Symble,内容为本例中的风车;   9. 将这个Symble的Instance name取名为 spin1;   10. 创建一个新的名为‘Action Layer’的Layer;   11. 在这个layer的第三个Keyframe里创建一个属性为Moive Clip,名为‘action’的新Symble;   12. 在这个Movie Clip 的编辑区内,在第一个keyframe加入Actionscript。将实现如下功能:   。鼠标的位置;
Spinner的位置;他们之间的距离;
Spinner将以多快的速度运动;Spinner的移动;  下图就是将要加入的Acionscript:
13. 下面,我们一步一步来看一下上面的Actionsctipt是如何实现上述5个功能的:   a。鼠标位置:要鼠标的位置,需要取得刚才创建的button‘drag1’的x,y坐标值,由于这些都是有用的信息,因此我们需将他们保存进变量中,如下:   Set Variable: "thisX" = GetProperty ( "/drg1", _x )   Set Variable: "thisY" = GetProperty ( "/drg1", _y )   b。Spinner的位置: 道理同上,只是这次要取得‘spin1’的x,y值,如下:   Set Variable: "spX" = GetProperty ( "/spin1", _x )   Set Variable: "spY" = GetProperty ( "/spin1", _y )   c。他们之间的距离:首先是空间中两点的距离公式:   distance^2 = (X2 - X1)^2 + (Y2 - Y1)^2   则据此和上面两步可以得到二者之间的距离:   Set Variable: "difX" = thisX - spX   Set Variable: "difY" = thisY - spY   d。Spinner将以多快的速度运动:Spinner的移动速度将取决于给定的步长值(步长值越小,移动速度越快)。在本例中我们取步长值25分别去除变量difX和difY:   Set Variable: "xStp" = difX / 25   Set Variable: "yStp" = difY / 25   e。Spinner的移动:以下这两行Actionscript将使Spin1根据上述Action产生一套新的坐标值并从新定位:   Set Property ("/spin1", X Position) = spX + xStp   Set Property ("/spin1", Y Position) = spY + yStp   14. 在‘action’的Movie Clip里插入一个新的Layer,并为两个Layer插入两个frame;   15. 在第二个Layer里的第二个frame里,按F7插入一个Blank Keyframe;   16. 将步骤13里的Actionscript全部copy/paste到这个blank Keyframe里,如图:
   17. 回到主Moive里,在Action Layer的第三个Keyframe里加入Stop actionscript,并注意你的Action Movie Clip 在第三个keyframe里;   18. 好了,最后我们生成的所有Layer的结构情况如图:
站内搜索