上次我们已经搞定了敌人和自己的坦克，建好了战争的舞台。接下来，就让这场大戏热闹点儿！首先，得让咱家坦克开火，这样玩着才过瘾。今天，就来看看怎么给坦克装上子弹发射器，让它们在屏幕上打得火热！
子弹的诞生：封装Bullet类
咱们玩儿的那些游戏里面，子弹跟坦克的枪一样重要，是战争胜利的法宝。要想让子弹打得准，咱们得为它量身定做一个”Bullet类”。这类型就是记录子弹的位置、方向、速度和飞行方式啥的。试想你让子弹从坦克炮孔里飞出去，耳边还有风声吼叫，简直不要太刺激！
//子弹类
function Bullet(x,y,direct,speed){
this.x=x;
this.y=y;
this.speed=speed;
this.direct=direct;
this.timer=null;
this.run=function(){
switch(this.direct){
case 0:
this.y-=this.speed;
break;
case 1:
this.x+=this.speed;
break;
case 2:
this.y+=this.speed;
break;
case 3:
this.x-=this.speed;
break;
}
}
}
装弹上膛：在Hero类中添加shotEnemy方法
//定义一个Hero类
function Hero(x,y,direct,color){
//下面两句话的作用是通过对象冒充达到继承的效果
this.tank=Tank;
this.tank(x,y,direct,color);
//射击敌人函数
this.shotEnemy=function(){
switch(this.direct){
case 0:
heroBullet=new Bullet(this.x+10,this.y,this.direct,1);
break;
case 1:
heroBullet=new Bullet(this.x+30-4,this.y+10+4,this.direct,1);
break;
case 2:
heroBullet=new Bullet(this.x+10,this.y+30,this.direct,1);
break;
case 3:
heroBullet=new Bullet(this.x-4,this.y+10+4,this.direct,1);
break;
}
//把这个子弹放入数组中——》push函数
//调用我们子弹的run
//var timer=window.setInterval("heroBullet.run()",50);
//heroBullet.timer=timer;
heroBullets.push(heroBullet);
var timer=window.setInterval("heroBullets["+(heroBullets.length-1)+"].run()",50);
heroBullets[heroBullets.length-1].timer=timer;
}
}
要让咱的坦克能开火，得给”Hero类”添个叫shotEnemy的新功能，这就是咱的瞄准器，控制开火时机和方向。然后在键盘监听函数里搞个新事件，比如按一下”J”键，坦克就能开火了。想象一下，你紧张地按下发射键，子弹瞬间飞出，直击敌方坦克，那得多刺激
第一次试射：子弹的问题
case 74: //J :发子弹
hero.shotEnemy();
break;
我刚开始玩这个游戏的时候，弹药怎么都不对劲。开火后就像破弦之箭，速度越来越快，肯定有问题呀。找来找去找原因，原来子弹打出去就不会回来，就算离开画面了也一样。这不就跟天上的流星似的么，漂亮但就是抓不到。
解决问题：给子弹添加isLive状态
为了防止子弹乱飞，我们给它加了个”isLive”的标识，就表示这颗弹子是不是在咱的游戏里？只要弹子跳出边缘，那么这个设定就算作废，跟跳出边界的弹子没两样，失效了。每次界面更新，这些失效的弹子都不用重新画，就能解决子弹速度越来越快的问题
//子弹类
unction Bullet(x,y,direct,speed){
this.x=x;
this.y=y;
this.speed=speed;
this.direct=direct;
this.timer=null;
this.isLive=true;
this.run=function(){
//判断子弹是否已经到边界了
if(this.x=400||this.y=300){
//子弹要停止
window.clearInterval(this.timer);
//子弹死亡
this.isLive=false;
}else{
//可以去修改坐标
switch(this.direct){
case 0:
this.y-=this.speed;
break;
case 1:
this.x+=this.speed;
break;
case 2:
break;
}
}
}
优化代码：添加刷新子弹函数
我们给游戏添了刷新子弹的功能，每隔一秒就检查一下子弹是不是还在“活”着，只要活着就重现出画面，看起更舒服了，玩得更加过瘾！
完整的游戏体验：坦克大战的最终代码
//定时刷新我们的作战区(定时重绘)
//自己的坦克，敌人坦克，子弹，炸弹，障碍物
function flashTankMap(){
//把画布清理
cxt.clearRect(0,0,400,300);
//我的坦克
drawTank(hero);
//我的子弹
drawHeroBullet();
//敌人的坦克
for(var i=0;i<3;i++){
drawTank(enemyTanks[i]);
}
}
我们把坦克大战搞得越来越好，大家玩起来超顺手！只要动动手就能控制坦克的大炮消灭敌人，真心过瘾。代码全都摆在这儿，像”tankGame06.js”和”坦克大战.html”这样的文件，就是为了让你们玩得痛快淋漓。
//画出自己的子弹
function drawHeroBullet(){
for(var i=0;i<heroBullets.length;i++){
var heroBullet=heroBullets[i];
if(heroBullet!=null&&heroBullet.isLive){
cxt.fillStyle="#FEF26E";
cxt.fillRect(heroBullet.x,heroBullet.y,2,2);
}
}
}
邀请玩家：加入这场坦克大战
哥们儿，咱们的坦克大战游戏开始！赶快加入，相信你会被那心跳加速的刺激感所吸引。只需要坐在电脑前，控制坦克瞄准敌人，一枪射出，就能体验真实的刺激战斗快感。别再磨蹭了，马上试玩！
评论0