Flash设计动物行为效果之蛇篇

实例效果

　　白白的纸上，一只金光闪闪的蛇在不停地游动，效果逼真。而且，我们可以控制蛇的节数的变化。制作中，大家要注意对编程技巧的研究。

设计步骤

　　设置FLASH场景大小为550px x 450px，背景为白色，60fps。“属性”面板设置如图1所示。

图1

一、设计元件

　　1． 制作金蛇

　　按快捷键Ctrl+F8新建一个名为max的“影片剪辑”元件。在max元件第1帧的场景里制作一个蛇头，如图1所示，蛇头的长为18px；高为12px。

　　注意：一定要如图2所示把场景的中心点放在蛇头的中心，防止蛇头和蛇身脱节。

图2

图3

　　点选max元件场景中的第2帧，按快捷键F7键新建一个空白关键帧，并如图片3所示在第2帧的场景里制作一个蛇节。蛇节长6.5px，高6.5px。

　　分别在第35，70，100帧按F6键插入关键帧，蛇节大小分别改为（6px，4px）、（6px，1.5px）、（6px，1px）。分别选中第2，35，70帧，选择“属性”面板“补间”下拉列中的“形状”命令，见图4。如果为了效果更加逼真，可以用不使用“形状渐变”动画，使用“逐帧”动画。设置好的“逐帧”动画如图5所示。

图4

图5

　　2． 制作按钮

　　按快捷键Ctrl+F8新建一个“按钮”元件，写上“确定”二字。个人根据爱好随意设计

　　3． 设计Action影片。（大家可以先跳过代码，看下面的元件设计）

　　按快捷键Ctrl+F8新建一个名为action的“影片剪辑”元件。点选action元件场景中的第1帧，按F9键，在弹出“动作”面板中输入如下代码：

// 以下代码实现了蛇的运动
// 得到action元件在X轴方向上的位移值
 dx =_root.mouser._x-x1;
// 得到action元件在Y轴方向上的位移值
 dy =_root.mouser._y-y1;
// 蛇的节数加1
 cnt++
 max=_root.max
// 当蛇的节数超过最大值时，置0，不让蛇无限变长
 if (cnt>max) {
  cnt = 0;
 }
 // 复制max元件，使蛇的节数不断增加
 duplicateMovieClip("_root. head", "head"+cnt,cnt);
 // 把变量y1的值赋值给实例“head”
_root["head"+cnt]._x=x1;
// 把变量y1的值赋值给实例“head”
 _root["head"+cnt]._y=y1;
// 把影片action的x轴坐标值赋给变量x1
 x1=_root.mouser._x;
// 把影片action的y轴坐标值赋给变量y1
 y1=_root.mouser._y;
// 以下代码实现了蛇节角度的变化，从而使效果逼真
// 使蛇头与蛇节的角度变化一致
// alfa是控制蛇节角度的变量
 if (Number(dx) == 0) {
  alfa = 90;
 } else {
// 变量x为角度正切值
  x = dy/dx;
  if (Number(x)<0.99 and Number(x)>Number(-0.99)) {
// 本应用泰勒展开式计算该角度值，但考虑有些朋友不懂，就简单让它乘以40，如不乘蛇就不那么光滑了
   alfa = (Number(x-x*x*x/3)+Number(x*x*x*x*x/5))*57.29578;
  } else if (Number(x)>=0.99 and Number(x)<=1.01) {
// 如果角度值恒等于1就设角度为45度
   alfa = 45;
  } else if (Number(x)<=Number(-0.99) and Number(x)>=Number(-1.01)) {
   alfa = -45;
  } else if (Number(x)>1.01) {
   alfa = 90-(Number(1/x-1/x/x/x/3)+Number(1/x/x/x/x/x/5))*57.29578;
  } else {
   alfa = -90-(Number(1/x-1/x/x/x/3)+Number(1/x/x/x/x/x/5))*57.29578;
  }
 }
 if (Number(dx)<0) {
  alfa = alfa-180;
 }
 _root["head"+cnt]._rotation=alfa;

　　4． 接着，在第2帧中输入如下代码：

// 构造回路
gotoAndPlay(1);

二、设计场景

　　1． 回到“场景1”，双击“图层 1”的文字，改名为actions。按快捷键Ctrl+L打开“库”面板，把action“影片剪辑”元件拖拽到该层的场景中，这时场景中会多出一个白色的小圆圈，见图6箭头所指。点选这个白色的小圆圈（action元件），在“属性”面板中起实例名为mouser，如图6所示。接着点选该层的第300，550，800帧按下F6键。再分别点选第1，300，550帧，选择“属性”面板中的“补间”命令，见图4。

图6

　　2． 点选actions层第1帧，按F9键，输入如下代码：

// 初始变量cnt的值为0
cnt = 0; 
// 默认蛇的长度为50节
max = 50;
// 初始输入文本框的值为50
mpoints = max;
在第800帧输入代码：
gotoAndPlay(2);

　　3． 单击“时间轴”面板中的“添加运动引导层”按钮 新增一个引导层。在该层里画一条好似汽车赛道的曲线。将actions层各关键帧中的影片action元件吸附在曲线上，位置和最终设置效果如图7所示。

　　注意：第1和第800帧的位置要错开一些，以保证蛇游动的流畅性。见图7所示。

图7

　　4． 新建一层，改名为Text。在改层里写下“请输入蛇的节数:”几个字，见图8，点选“文本”工具在文字右边拉出一个文本框。接着如图9设置这个文本框为“动态”文本框，设置输入变量名为mpoints，借此实现对蛇节数的控制。

图8

图9

　　5． 把max元件拖拽到场景中，在“属性”面板中为它起个实例名为head。

　　6． 再新建一个button层。把设计好的“确定”按钮拖放到如图8所示的位置。点选该按钮，按F9键，输入如下代码：

// 当“确定”按钮被按下的时候，删除原有的影片
on (release) {
cnt = 0;
    while (Number(cnt)<Number(Number(max)+1)) {
        removeMovieClip("head" add cnt);
        cnt = Number(cnt)+1;
} 
// 把输入进文本框的变量值赋给max，实现用户控制蛇节
max = mpoints;
    cnt = 0;  
}

　　效果到这里就完成了。希望大家这个例子能给大家什么启发。譬如用该例的方法结合影片复制函数实现一群蝌蚪的不规则游动。至于具体的实现方法就留给大家自己思考吧。