Html5版飞机大战游戏中（Boss战）制作

内容在“60行代码，制作飞机大战游戏”的基础上，继续追加入了Boss战的功能。

boss的血量默认设置为100了，可以二次开发调整……(^_^)

玩起来有一定难度哈。 试玩地址：点击试玩

实现功能

1. 添加玩家飞机，并进行控制
2. Boss能够左右移动
3. Boss发射三种子弹
4. 子弹击中玩家飞机
5. 子弹击中Boss，血量计算

项目源码：http://pro.youyu001.com 

待优化的功能

1）内存优化，子弹图片需要回收

（随着子弹数量增多，计算量一直增大，会卡死，设备发热，

想拼机器性能可以长时间运行试试）

2）血条的制作

（根据血量数值，控制血条图片宽度）

 

3）激光与玩家飞机的碰撞

（激光所在的区域范围，这里不能去）

代码说明

1）通过帧频计算时间相关

定义两个变量，用于记录帧频

var fireSpeed1 = 30;//boss发射子弹的间隔帧数
var fireSpeedSub1 = 0;//记录发射子弹后的帧数

在帧频函数中，执行下面代码。每0.5秒发射一次子弹

//boss定时发射子弹（方式1）
if(fireSpeedSub1 >= fireSpeed1) {
    boss_fire1();//发射子弹
    fireSpeedSub1 = 0;
}
fireSpeedSub1 ++;

2）发射多个子弹并控制

定义存放子弹图片的数组

var bulletList = [];//boss子弹存放在这个数组

当发射子弹时，将子弹图片push到数组中

function boss_fire1() {
    var bullet = new PIXI.Sprite.fromImage("res/bullet/img_bullet_17.png");
    bullet.anchor.set(0.5);//设置锚点为中心
    app.stage.addChild(bullet);
    bulletList.push(bullet);
    bullet.x = boss.x;
    bullet.y = boss.y;
}

给子弹图片添加更多的属性，这样在子弹移动时可以做到差异化。（Javascript的特性）

bullet.speedR = 0.1; //利用javascript对象的特性，临时记录下子弹旋转速度
bullet.speedY = 3; //利用javascript对象的特性，临时记录下子弹y方向的速度

在帧频函数中，让bulletList数组中的子弹进行移动

//boss子弹移动
for(var i = 0; i < bulletList.length; i ++) {
	var bullet = bulletList[i];
    bullet.y += bullet.speedY;
    if(bullet.speedX) { //判断如果子弹有x方向速度，则进行横向移动
        bullet.x += bullet.speedX;
    }
    if(bullet.speedR) { //判断如果子弹有旋转速度，则进行旋转
        bullet.rotation += bullet.speedR;//自转
    }
}

完整代码