《Flash 8实训教程-游戏制作入门》第8章 射击游戏

第8章射击游戏8.1游戏说明8.2准备阶段8.3发射子弹和生成敌机8.4判断及分数处理 8.1游戏说明

本游戏是一个常见的反应类游戏，在游戏中，敌机不断飞向我方战机，如果被这些敌机所碰撞，则我方战机将被消灭。同时，我方战机需要玩家不断点击鼠标左键以发射子弹射击敌机，敌机被射中后爆炸并从游戏中消失。并且，游戏还有一定的时间限制，在一定的时间内击落的敌机越多则得分越高。 8.2准备阶段

8.2.1游戏制作

1．制作我方战机

(1)新建一个Flash文件，在〖属性〗面板中，设置动画的〖大小〗为〖宽〗“400”，〖高〗“500”，〖帧频〗为“32 fps”。

(2)用矢量图形处理软件如CorelDraw或Illustrator打开素材(配套光盘中第八章\素材\0241.EPS”)。如果没有矢量图形处理软件，也可以用Photoshop打开这个文件。

(3)双击图层1，改名为“myplane”。

(4)在图形图像软件中全选战机，按Ctrl+C键将其复制，再回到Flash舞台，按Ctrl+V键将其粘贴。

(5)使用〖任意变形工具〗，调整战机的大小和比例。

(6)按两次Ctrl+B键打散战机。

(7)在保持战机被选中的情况下，按F8键，调出〖转换为元件〗对话框，在对话框中，设置〖名称〗为“flight_mc”，〖类型〗为“影片剪辑”，〖注册点〗为“上排中间”。注意，这里我们没有像前几章那样把打散的内容用Ctrl+G键进行组合，原因是下面仍需要保持打散的状态。

(8)按Ctrl+F8键或者选择菜单命令〖插入〗→〖新建元件…〗，调出〖创建新元件〗对话框，在对话框中，设置〖名称〗为“fire_mc”，〖类型〗为“影片剪辑”。点击〖确定〗后进入新元件的编辑界面。

(9)在“fire_mc”影片剪辑的图层1中，使用〖椭圆工具〗在〖属性〗面板中设置〖笔触颜色〗为“无”，〖填充颜色〗为“白到黑的放射状渐变”，在舞台上绘制一个椭圆。

(10)使用〖选择工具〗选中椭圆，调出〖颜色〗面板中的〖混色器〗，在〖混色器〗中，选择原为白色的游标，将它的〖红〗、〖绿〗、〖蓝〗三项分别设置为240、253、121。选择原为黑色的游标，将它的〖红〗、〖绿〗、〖蓝〗三项分别设置为“238”、“0”、“0”，并把它的位置向左拖动一些。最后，椭圆的效果见图8-1。图8-1图8-2

(12)再新建一个层，使用〖椭圆工具〗在新层中绘制一个比刚才的椭圆大的椭圆。使用〖选择工具〗选中椭圆，在〖颜色〗面板的〖混色器〗中，选择左边的游标，设置其对应的〖红〗、〖绿〗、〖蓝〗为217、240、6；选择右边的游标，设置其对应的〖红〗、〖绿〗、〖蓝〗值为“255”、“255”、“255”(白色)，〖Alpha〗值为“0%”。将左边的游标向右拖动一些。如上一步，使用〖填充变形工具〗单击椭圆，将渐变的中心点向上拖一点，效果如图8-3所示。图8-3

(13)使用〖选择工具〗，单击图层2的第10帧，按F6键以生成关键帧。

(14)单击图层2的第1帧，使用〖任意变形工具〗，将椭圆略缩小一些。

(15)单击图层2的第1帧和第10帧之间的任意一帧，在〖属性〗面板中选择〖补间〗为“形状”，制作形状补间。

(16)将图层2拖动到图层1的下方。

(17)单击图层1的第10帧，按F5键以生成普通帧。现在，时间轴和舞台的情况如图8-4所示。图8-4

(18)单击〖场景1〗，返回主时间轴。

(19)双击舞台上的“flight_mc”影片剪辑的实例，进入编辑界面。在时间轴上方选择〖放大比例〗为“400%”，以便编辑。

(20)将图层1重命名为“flight”。

(21)新建一个层，并将这个层命名为“fire”。

(22)在新层中，从〖库〗中拖动两个“fire_mc”影片剪辑的实例，放在飞机的尾部，使用〖任意变形工具〗调整火焰的大小，如图8-5所示。图8-5

(23)单击plane层的第2帧，按F6键，建立一个关键帧；再单击该层的第11帧，按F6键，建立一个关键帧。

(24)使用〖选择工具〗部分选择战机，将不同的部分移动到各个任意位置，如图8-6所示。图8-6

(25)新建一个图层，命名为“spark”，并确保这个图层在flight图层的上方。

(26)单击spark图层的第2帧，按F6键以建立一个关键帧。

(27)使用〖椭圆工具〗，在〖属性〗面板中设置〖笔触颜色〗为“无”，〖填充颜色〗为“白色”，在此帧以小十字为中心绘制一个正圆。

(28)单击spark图层的第11帧，按F6键以建立一个关键帧。

(29)使用〖选择工具〗选中正圆，使用〖任意变形工具〗将圆从中心往外扩大，扩大到基本与战机的碎片范围差不多。在〖属性〗面板将圆的〖填充颜色〗设置为“黄色”，在〖颜色〗面板的〖混色器〗中，将〖Alpha〗值设置为“0%”。

(30)单击spark图层的第2帧和第11帧中间的任意一帧，在〖属性〗面板设置〖补间〗为“形状”。

(31)新建一个图层，并命名为action。

(32)单击action层的第1帧，按F9键以调出〖动作〗面板，在面板中输入语句“stop();”。

(33)单击action层的第11帧，按F6键以生成关键帧。在〖动作〗面板中输入语句“stop();”。

(34)点击〖场景1〗，返回主时间轴。

(35)按Ctrl+Enter键运行动画并查看效果，可以看到一架喷着火的战机。

2．制作敌机

(1)在主时间轴新建层，命名为“enemyplane”。

(2)使用图形图像处理软件打开配套光盘中的敌机图片(配套光盘中第八章\素材\0265.eps)，复制并粘贴到Flash中。

(3)使用〖任意变形〗工具调整战机大小，并将战机转成头朝下。

(4)按Ctrl+B键两次打散战机，按F8键将它转换为影片剪辑，取名为“enemy_mc”，并在转换影片剪辑时，设置〖注册点〗在“下排中央”，在〖高级〗选项中设置〖标识符〗为“enemy”。

(5)双击〖库〗中的“flight_mc”影片剪辑，进入编辑界面。单击“spark”层的第1帧，按住Shift键单击spark层的第11帧，全选此层的所有帧。在选中的帧处，用鼠标右键单击，在弹出的快捷菜单中选择〖复制帧〗。

(6)双击〖库〗中的“enemy_mc”影片剪辑，进入编辑界面。

(7)新建一个层，并且将它命名为“spark”。用鼠标右键单击此层的第1帧，在弹出的快捷菜单中选择〖粘贴帧〗。

(8)其余步骤与制作我方战机类似。火焰可以使用前面做的影片剪辑，只需要将火焰方向同样转180°，不需要再重新做一遍火焰。

(9)在最后一帧的ActionScript语句中，除了跟我方战机相同的stop语句外，还要增加一个语句“this.removeMovieClip();”。

(10)制作完毕后，按Ctrl+Enter键查看效果，如图8-7所示。图8-7

3．制作信息显示文本框

(1)单击〖场景1〗，回到主时间轴。

(2)新建一个层，并命名为“text”。

(3)使用〖文本工具〗，在此层靠近动画的顶部，制作两个动态文本框，在〖属性〗面板中，设置其〖实例名称〗分别为“score_txt”和“timeLeft_txt”，〖字体〗为“ArialBlack”，〖文本(填充)颜色〗为“黄色”，〖字体大小〗为“20”，对应〖变量〗分别为“score”和“timeLeft”。

(4)使用〖选择工具〗圈选两个文本框，选择菜单命令〖窗口〗→〖对齐〗或按Ctrl+K键调出〖对齐〗面板，并在面板中选择“底部对齐”。

4．制作子弹

(1)按Ctrl+F8键调出〖新建元件〗对话框，在对话框中，设置元件〖名称〗为“bullet_mc”，〖类型〗为“影片剪辑”，并单击〖高级〗按钮，在扩展的对话框部分选择“为ActionScript导出”，此时“在第一帧导出”自动被勾选，设置〖标识符〗为“bullet”。

(2)使用〖椭圆工具〗，在〖属性〗面板中设置〖笔触颜色〗为“无”，〖填充颜色〗为“黄色”，按住Shift键，在舞台正中绘制一个正圆。

(3)使用〖选择工具〗选中正圆，在〖属性〗面板中设置〖宽〗和〖高〗均为“8”，设置〖x〗和〖y〗均为“－4”。

(4)使用〖椭圆工具〗，在〖工具箱〗下方，选择“对象绘制”，在〖属性〗面板中设置〖笔触颜色〗为“无”，〖填充颜色〗为“白色”，按住Shift键，在舞台正中绘制一个正圆。

(5)使用〖选择工具〗选中正圆，在〖属性〗面板中设置〖宽〗和〖高〗均为“6”，设置〖x〗和〖y〗均为“－3”。最后的效果如图8-8所示。

(6)单击〖场景1〗，返回主时间轴。图8-8

5．制作背景元件

(1)按Ctrl+F8键新建一个元件，设置〖名称〗为“background_mc”，〖类型〗为“影片剪辑”。

(2)选择菜单命令〖导入〗→〖导入到舞台…〗或按Ctrl+R键，将配套光盘中第八章\素材\1.jpg导入舞台。

(3)使用〖选择工具〗选中图片，在〖属性〗面板中设置它的〖x〗和〖y〗均为“0”。

(4)按F8键将图片转换为元件，在〖转换元件〗对话框中，设置〖名称〗为“background_pic”，〖注册点〗为“左上角”，〖类型〗为“影片剪辑”。

(5)保持此影片剪辑被选中，在〖属性〗面板中设置它的〖x〗和〖y〗分别为“0”和“－500”，〖实例名称〗为“bg1”。

(6)按住Alt键将bg1向上方拖动一些，复制一份。在〖属性〗面板中设置它的〖x〗为“0”，〖y〗为“0”和“－1000”，〖实例名称〗为“bg2”。

(7)单击〖场景1〗，返回主时间轴。

(8)新建一个图层，并将它命名为“backgound”，再将这个图层拖到所有其它图层的下方。

(9)从〖库〗中拖动“backgound_mc”影片剪辑到background图层，并在〖属性〗面板中将它的〖x〗和〖y〗设置为“0”和“0”，〖实例名称〗设置为“bg”。游戏界面如图8-9所示。图8-9

6．制作开始按钮

(1)新建一个图层，将它命名为“button”。

(2)按Ctrl+F8键，在〖新建元件〗对话框中，设置〖名称〗为“start_btn”，设置〖类型〗为“按钮”。按〖确定〗后进入按钮的编辑界面。

(3)选择〖文本工具〗，在〖属性〗面板中选择〖文本类型〗为“静态文本”，〖字体〗为“ArialBlack”，〖字体大小〗为“39”，在舞台上键入“START”。在保持选中的状态下，按两次Ctrl+B键打散，按Ctrl+G键进行组合。

(4)使用〖选择工具〗选中字，在〖属性〗面板中，设置〖x〗和〖y〗均为“0”。

(5)在〖按下〗帧中按F5键以生成普通帧，在〖点击〗帧中按F6键以生成关键帧。

(6)单击〖点击〗帧以选中，在此帧中，用〖矩形工具〗画一个矩形，大小与刚才的文本组合相等，位置也放在(0，0)。

(7)点击〖场景1〗，返回主时间轴。

(8)点击“button”图层的第1帧以选中，从库中拖取“start_btn”按钮放在舞台正中。

(9)在〖属性〗面板中，将这个按钮的〖实例名称〗设置为“startbtn”，效果如图8-10所示。图8-108.2.2重点与难点详解

当绘制椭圆和矩形之类的图形时，在工具箱的下半部有两个选项，一个是“对象绘制”，一个是“贴紧至对象”。其中，“贴紧至对象”默认是选中的，它表明如果我们移动一个对象靠近一个舞台上存在的对象时，这个对象会跟原对象自动对齐。而“对象绘制”选项默认是没有选中的，在这种状态下绘制对象，前后绘制的不同对象发生重叠的时候，移开后面绘制的对象，就会发现前面的对象重叠部位已经被剪掉了，见图8-11。如果使用“对象绘制”选项后，再绘制时，每个形状都是独立的对象，就不会发生这样的情况，见图8-12。图8-11图8-12 作业与练习

请按本例，完成射击游戏基本元件的制作。 挑战与提高

1．能否让战机看起来更像是飞在背景的上方呢？

2．是否可以制作其它样式的子弹，如火箭炮等？

3．可否制作其它样式的敌机？ 提示与解答

1．要让战机看起来更像是飞在背景上方，我们可以给战机添加适当的阴影。可以在战机影片剪辑中增加一个层，在此层中，制作一架灰色半透明的飞机，并与原战机的位置错开一段距离。

2．其它式样的子弹可以使用导入图片的方法来制作。注意，如果导入位图，会出现一个难看的方框，不可取，因此要导入矢量图形，或直接在Flash中绘制才行。增加的子弹标识符要与例中的标识符有所区别。

3．同理，其它样式的敌机在标识符上也应该跟当前的敌机有所区别。 8.3发射子弹和生成敌机

8.3.1游戏制作

1．让背景滚动起来

(1)打开上节完成的Flash源文件。

(2)在主时间轴中，选择“start_btn”按钮的实例“startbtn”，按F9键调出〖动作〗面板，并输入以下语句段：

on(release){

startbtn._visible=false;

_root.bg.onEnterFrame=function(){

if(bg.bg2._y<-500){

bg.bg2._y+=2;

(3)按Ctrl+Enter键执行游戏，可以看到，点击开始按钮后，按钮本身消失，而背景开始向下滚动，从视觉效果来看，就像我方的战机在向前飞行一样。

2．使我方战机随鼠标移动

(1)在主时间轴中新建一层，将此层放在其它层的上方，并将此层改名为“action”。

(2)单击action层的第1帧，按F9键调出〖动作〗面板，在面板中输入以下语句：

(3)修改开始按钮的ActionScript语句，在on(release)后面的语句段中，添加一句“init();”。

(4)按Ctrl+Enter键执行游戏，点击START按钮，背景开始滚动，移动鼠标，我方战机平滑地跟着鼠标移动。

3．开始发射子弹

(1)继续修改action层第1帧中的ActionScript语句。在myflight.onEnterFrame所执行的程序段的末尾，添加以下程序段：

if(firing&&repeatTime==0){

createShots("bullet",this._x,this._y-5,0,-15);

}

repeatTime++;

repeatTime%=fireRate;

(2)在init()函数末尾，添加如下语句以初始化子弹所在的影片剪辑：

_root.createEmptyMovieClip("shotLayer",99);

shotCount=0;

(4)按Ctrl+Enter键执行动画，点击开始按钮后，不断单击鼠标左键就可以发射子弹了，如图8-13所示。图8-13

4．生成敌机

(1)从舞台上删除敌机元件。

(2)修改主时间轴action层的第1帧中的语句，在myflight.onEnterFrame所执行的语句中再加入如下语句：

if(enemyTime==0){

ds=random(100)+80;

createEnemy("enemy",ds,-30);

createEnemy("enemy",400-ds,-30);

createEnemy("enemy",200,-30);

}

enemyTime++;

enemyTime%=enemyRate;

(4)在init函数的末尾添加如下语句：

_root.createEmptyMovieClip("enemyLayer",98);

enemyCount=0;

(5)按Ctrl+Enter键执行动画，点击开始按钮后，敌机自动以每次3架的速度出现，每架敌机均按正弦波轨迹运动，只是正弦波的幅度各不相同。因此界面上可见敌机似杂乱无章地出现，见图8-14。图8-148.3.2重点与难点详解

在init函数中，我们设置了几个变量，并分别赋给它们一个初始值。其中，变量firing用于记录当前我方战机是否正在开火，初始值为false，说明我方战机没有开火。fireRate用于记录如果按下鼠标左键不放，我方战机将以什么样的速度发射子弹，其初始值为10，也就是每隔10帧发射一发子弹。我们现在设定的帧频是32fps，也就是每秒约发射3发子弹。enemyTime用于记录自从上一批敌机生成后经过了几帧，初始值是0。enemyRate用于记录隔多久生成一批敌机，初始值是180，也就是经过约6秒才生成一批敌机。score变量用于记录获得的分数。timeLeft变量用于记录还剩余多少时间，初始设定是60秒。在使我方战机随鼠标平滑移动的代码中，首先通过语句“tx=_xmouse;”取得当前鼠标的x坐标值作为战机移动的目标x坐标，再通过“dx=tx-this._x;”取得现坐标与目标坐标的x坐标之间的距离，然后每一帧移动这段距离的15%(this._x+=dx*0.15;)。如果像前几章那样通过startDrag或直接用this.x=_xmouse来实现，我们会发现战机有些跳动，且移动不够平滑。 作业与练习

按照本例完成背景滚动、我方战机随鼠标移动、子弹发射、敌机的生成和移动。 挑战与提高

1．要调快生成敌机的速度，应该调整什么？调整到多少合适？

2．要加快敌机的飞行速度，应该调整什么？ 提示与解答

1．调快生成敌机的速度，关键在于enemyRate的值。这个值越小，意味着两批敌机之间相隔的时间越少，生成的速度也就越快。调整到多少合适取决于个人的反应速度，个人反应速度块，这个值就可以小一些。也可以在运行过程中，动态地调整这个值，如达到一定分数后，调整这个值。

2．加快敌机的飞行速度需要调整“enemyLayer[nm].dy=Math.random()*3;”，可以加大所乘的系数，如Math.random()*4等；也可以加一个适当的值，如Math.random()*3+5等。

8.4判断及分数处理

8.4.1游戏制作

1．判断时间是否用完

(1)打开上一节完成的Flash文件。

(2)单击主时间轴的action层的第1帧，按F9键打开〖动作〗面板。在程序的最后，加上如下的一个新函数：

(3)在前面的init函数中，再加上以下两行语句：

checkTimer()

timer=setInterval(checkTimer,1000);

(4)按Ctrl+Enter键以运行游戏，点击开始按钮后，游戏开始倒计时。当时间用完的时候游戏结束，清除所有敌机和子弹，停止背景滚动，停止发射子弹，重新显示开始按钮。

2．判断子弹是否击中敌机

(1)修改createShots函数，在其中的shotLayer[nm].onEnterFrame函数中加入以下判断语句：

3．判断我方战机是否被敌机所撞击

(1)修改createEnemy函数，在其中的enemyLayer[nm].onEnterFrame函数中增加以下语句：

if(this._currentframe==1&&myflight.hitTest(this._x,this._y,true)){

timeLeft=1;

checkTimer();

myflight.play();

}

(2)按Ctrl+Enter键运行动画，并让敌机撞击我方战机，我方战机爆炸。此时，再次点击开始按钮，我方战机仍然处于爆炸后的状态。

(3)修改init函数，在函数末尾加上以下两行语句：

myflight.swapDepths(100);

myflight.gotoAndStop(1);

(4)运行动画，在我方战机爆炸后，再次点击开始按钮，我方战机即可恢复正常了。

4．添加音效

(1)选择〖文件〗→〖导入〗→〖导入到库…〗，将配套光盘中所带音效素材(第八章\素材\BOMB1.WAV)导入到库中。

(2)在〖库〗中双击“enemy_mc”影片剪辑，进入它的编辑界面。

(3)新建一个图层，将这个图层命名为“Sound”。

(4)右单击“Sound”图层的第2帧，在弹出的快捷菜单中选择〖创建空白关键帧〗。

(5)从〖库〗中拖动BOMB1.WAV放到此帧，此时，在这个图层中出现声波形状，表明声音添加成功，如图8-15所示。图8-15

(6)按Ctrl+Enter键运行游戏。现在，每击中一架敌机，就会在爆炸动画的同时伴有爆炸声，效果更加逼真。8.4.2重点与难点详解

我们用“timer=setInterval(checkTimer,1000);”语句设置一个定时器，这个定时器叫做“timer”，它每隔1秒调用checkTimer函数一次。

checkTimer函数先把剩余的秒数减1，然后判断剩余时间是否为0，如果为0的话，就用“deletemyflight.onEnterFrame;”语句来停止我方战机的移动，也停止我方战机继续射击。然后，再用“deletebg.onEnterFrame;”语句停止背景滚动。接着，用两次removeMovieClip方法，把子弹和敌机全部从屏幕上清除，重新显示开始按钮，并且把定时器取消。当再次单击开始按钮时，我们使用语句“myflight.gotoAndStop(1);”使我方战机回到没有爆炸的状态。

当判断子弹是否击中敌机的时候，判断条件“this.hitTest

(enemyLayer[eName])&&enemyLayer[eName]._