FLASH交互动画设计

FLASH交互动画设计

一、总体设计

1.游戏总体概况

本实验为FLASH交互动画之——卡通游戏“接宝石”。移动小盆接上面落下来的物体，落下的不同物体代表其特定的分值。加分暂无上限，减分暂无下限，时间限制为20秒。

2.游戏界面及流程

【图1】游戏初始界面

【图1】为游戏初始界面，红宝石、蓝宝石、炸弹、钻石分别为排成一横线的旋转体。若按[帮助]，则出现【图2】游戏规则界面。

【图2】游戏规则界面

【图2】表明接到的物体所代表的分值：炸弹（-6分）、蓝宝石（+2分）、红宝石（+3分）、钻石（+8分）。

若在【图1】游戏初始界面按[开始]则进入【图3】游戏界面。

【图3】游戏界面

初始状态分数为0，剩余时间为20秒，游戏开始后，移动小盆接上面落下的物体，炸弹（-6分）、蓝宝石（+2分）、红宝石（+3分）、钻石（+8分）。当剩余时间显示为0时，游戏结束，分数栏显示不再变化，界面自动转到如下【图4】选择界面。

【图4】选择界面

若按[继续]，则进入【图3】游戏界面，开始新一轮的游戏；若按[退出]，则退到【图1】游戏初始界面。

二、详细设计

1. 创建新文档

新建一个AvctionScript 2.0空白文档，在其属性栏设置文档大小为600像素╳400像素。

2. 元件的准备

（1）创建影片剪辑

①创建名为“计分器”的影片剪辑元件

创建两个图层，自上而下分别命名为“action”和“文本”。

“文本”图层上的操作：输入静态文字“分数”，在“文本”图层第1帧拖曳出一个文本框，将其【属性】中的【文本类型】设置为“动态文本”，【变量】设置为“txt”，在该图层的第2帧处插入帧。得到结果如下图：

“action”图层上的操作：在该层第1帧，输入动作语句：txt=_root.score;

②创建名为“计时器”的影片剪辑元件

创建两个图层，自上而下分别命名为“Action”和“文本”。

“文本”图层上的操作：输入静态文字“剩余时间”，在“文本”图层第1帧拖曳出一个文本框，将其【属性】中的【文本类型】设置为“动态文本”，【变量】设置为“txt”，在该图层的第2帧处插入帧。得到结果如下图：

并将“文本”层延长至第3帧。

“Action”图层上的操作：分别在1，2，3帧上插入空白关键帧，然后在Action的第1~3帧分别输入代码：

第1帧代码：

now = new Date();

startTime = now.getTime();

hasTime = 20;

txt = hasTime;b

第2帧代码：

now = new Date();

tempTime = now.getTime();

txt = hasTime - Math.round(((tempTime-startTime)/1000));

if (txt == 0){

_root.gotoAndStop("end");

this.stop();

}

第3帧代码：

gotoAndplay(_currentframe-1);

if (_currentframe==0)

gotoAndplay(2);

③创建名为“所有下落物”的影片剪辑

a.创建图形元件“bomb”、“blue”、“red”、“diamond”，从左到右分别如下所示：

b.创建名为“炸弹”的影片剪辑，在其编辑状态下，将图形元件“bomb”从【库】中拖至其时间轴的第1帧，在第1帧创建补间动画。第18帧插入关键帧，然后在第1~17帧之间单击任意一帧，在其【属性】面板，设置【旋转】为逆时针/顺时针，圈数为1圈。在第18帧添加动作代码“gotoAndplay;”。用相同方法制作名为“blue”、“red”、“diamond”三个影片剪辑。将这四个影片剪辑设置为不同的时间轴长度。

c.创建名为“所有下落物”的影片剪辑，在其编辑状态下制作逐帧动画，第1~4帧分别为“炸弹”、“蓝宝石”、“红宝石”、“钻石”的实例,如下所示：

④创建名为“下落”的影片剪辑

设置两个图层，分别命名为“Actions”、“下落物”。

“下落物”图层的操作：将影片剪辑“所有下落物”拖曳至其“下落物”图层第1帧的舞台上，并在该图层第3帧插入帧。选中“所有下落物”对象，在【属性】-【实例名称】命名为“allthings”。

“Actions”图层的操作：在该图层的前3帧，插入空白关键帧，分别输入以下代码：第1帧代码：

var plusScore; //声明变量plusScore

k = Math.random(); //k为0~1之间的随机数

if (k<0.5) { //如果随机数小于0.5

allthings.gotoAndStop(1); //设置的角色播放第1帧（炸弹）

plusScore = -6; //炸弹分数设为-6

} else if (k<0.7) { //如果随机数在0.5~0.7之间

allthings.gotoAndStop(2); //设置的角色播放第2帧（蓝宝石）

plusScore = 2; //蓝宝石分数设为2

}else if (k<0.9) { //如果随机数在0.7~0.9之间

allthings.gotoAndStop(3); //设置的角色播放第3帧（红宝石）

plusScore = 3; //蓝宝石分数设为3

}else { //如果随机数大于0.9

allthings.gotoAndStop(4); //设置的角色播放第4帧（钻石）

plusScore = 8; //钻石分数设为8

}

this._x = random(500)+50; //随机决定对象出现的x轴坐标

this._y = -40; //y坐标均为-40

speed = 5+random(30);

第2帧代码：

this._y += speed; //对象y的坐标布顿增加，增量即速度

if (this._y>400) { //如果y坐标大于400，则表示已经跑出舞台

this.removeMovieClip(); //删除该影片剪辑

}else if (this._y<=350 && this._y+speed>=350) { //如果y小于350且下一次大于350 disX = Math.abs(this._x-_root.pen._x); //计算两个对象之间的距离

if (disX<60) { //如果距离小于60，表明接到了对象_root.score += plusScore; //总分加上接到的对象自身的分数this.removeMovieClip(); //然后删掉该对象

}

}

第3帧代码：

gotoAndPlay(_currentframe -1);

对名为“下落”的影片剪辑执行【链接】命令，在【链接属性】输入标识符“wuti”.