美文网首页Cocos Creator
aircraft-war(四)

aircraft-war(四)

作者: 马丁不姓马 | 来源:发表于2017-11-12 20:21 被阅读224次

aircraft-war(四)

敌机分为三种类型,所以需要三种Prefab,分别有自己的爆炸动画,可以共用一套脚本,要随机出现X轴初始位置。
接下来先制作一个“可以被击落的敌机”:

敌机Demo

从资源选择器中拖拽素材到层级选择器 → 添加碰撞组件 → 添加动画组件(在资源管理器创建动画资源) → 编写脚本 → (将组建从层级选择器拖拽到资源选择器(Prefab资源))
碰撞组件之前刚做过,再次跳过,下图为添加动画组件:

image.png

接下来编写脚本:

// enemy.js
cc.Class({
    extends: cc.Component,

    properties: {
        HP: {
            default: 0,
            type: cc.Integer,
            tooltip: '敌机血量',
        },
        speedMax: 0,
    },

    // use this for initialization
    onLoad: function () {
        this.speed = cc.random0To1() * this.speedMax;
        let manager = cc.director.getCollisionManager();
        manager.enabled = true;
    },
    //碰撞检测
    onCollisionEnter: function(other, self){
        
    },

    // called every frame, uncomment this function to activate update callback
    update: function (dt) {
        this.node.y -= dt * this.speed;
    },
    onHandleDestroy: function () {
        // Demo中零时使用,后续要使用对象池,参考bullet
        this.node.destroy();
    }
});

接下来需要给子弹Prefab添加碰撞组件。
在这里会遇到一个问题,各个组件都有碰撞组件,那敌机相互不就撞毁了吗?有没有什么办法可以限制碰撞对象?

碰撞分组管理

使用碰撞分组管理

image.png

之后在组件的属性检查器中选择分组:


image.png

接下来修改脚本:

cc.Class({
    extends: cc.Component,

    properties: {
        HP: {
            default: 0,
            type: cc.Integer,
            tooltip: '敌机血量',
        },
        speedMax: 0,
    },

    // use this for initialization
    onLoad: function () {
        // 速度随机[speedMax, speedMin]
        this.speed = Math.random() * (this.speedMax - this.speedMin + 1) + this.speedMin;
        let manager = cc.director.getCollisionManager();
        manager.enabled = true;
    },
    //碰撞检测
    onCollisionEnter: function(other, self){
        if (other.node.group !== 'bullet') {
            return;
        }
        if (this.HP === 0) {
            this.HP--;
            let anim = this.getComponent(cc.Animation);
            let animName = this.node.name + '_exploding';
            anim.play(animName);
            anim.on('finished',  this.onHandleDestroy, this);
            return;
        }
        if (this.HP > 0) {
            this.HP--;
        }
    },

    // called every frame, uncomment this function to activate update callback
    update: function (dt) {
        this.node.y -= dt * this.speed;
    },
    onHandleDestroy: function () {
        // Demo中零时使用,后续要使用对象池,参考bullet
        this.node.destroy();
    }
});

Bullet:

cc.Class({
   // ...
    //碰撞检测
    onCollisionEnter: function(other, self){
        this.bulletGroup.destroyBullet(self.node);
    },
   // ...
});

第一步就算完成了,实现功能是第一步,接下来要做的就是使用对象池,制作大批敌机,处理敌机出现的位置:

image.png

代码在这里

敌机组

先将其他两种类型的敌机做成Prefab作为准备资源,然后创建参考bulletGroup的制作方式,来制作enemyGroup。


image.png

脚本代码请参考——敌机组起飞代码
现在敌机组也起飞了,但是有个问题,被销毁的敌机回归对象池后,下一次出场时,还保持着被销毁时的状态,所以需要初始化一下:

image.png

给enemy.js添加初始化函数:

// enemy.js
 enemyInit: function () {
            // 初始化血量
        this.enemyHp = this.HP;
        // 找到node的Sprite组件
        let nSprite = this.node.getComponent(cc.Sprite);
        // 初始化spriteFrame
        if (nSprite.spriteFrame != this.initSpriteFrame){
            nSprite.spriteFrame = this.initSpriteFrame;
        }
    },
    // 碰撞检测
    onCollisionEnter: function(other, self){
        if (other.node.group !== 'bullet') {
            return;
        }
        if (this.enemyHp === 0) {
            this.enemyHp--;
            let anim = this.getComponent(cc.Animation);
            let animName = this.node.name + '_exploding';
            anim.play(animName);
            anim.on('finished',  this.onHandleDestroy, this);
            return;
        }
        if (this.enemyHp > 0) {
            this.enemyHp--;
        }
    },

然后在创建敌机的时候,要执行一遍初始化函数:

// enemyGroup.js
 // 生成敌机
    genNewEnemy: function (enemyInfo) {
        let poolName = enemyInfo.name + 'Pool';
        let newNode = D.common.genNewNode(this[poolName], enemyInfo.prefab, this.node);
        let pos = this.getNewEnemyPosition(newNode);
        newNode.setPosition(pos);
        newNode.getComponent('enemy').enemyGroup = this;
        // 初始化敌机状态
        newNode.getComponent('enemy').enemyInit();
    },

参考代码在这里
到这里,整体主要功能都已经实现,接下来要完成的,是游戏的积分、开始暂停与音效。

相关文章

  • aircraft-war(四)

    aircraft-war(四) 敌机分为三种类型,所以需要三种Prefab,分别有自己的爆炸动画,可以共用一套脚本...

  • aircraft-war(六)

    aircraft-war(六) Cocos creator/ aircraft-war# 最后的收尾工作 音效 完...

  • aircraft-war(一)

    aircraft-war(一) Game Scene 布局 首先制作场景中的部件,早cocos creator中创...

  • aircraft-war(零)

    在cocos creator的学习过程中,由于群体比较少,所以学习的资源也相对较少。在学习的过程中,也缺少很好的“...

  • aircraft-war(三)

    aircraft-war(三) 上一章的内容务必搞懂再进入这一步!这部分先来实现一个简单的功能,Hero接触道具然...

  • aircraft-war(二)

    aircraft-war(二) 双弹道子弹 双弹道子弹和弹道子弹差别并不大,实现起来也不难。先来找张图分析一下: ...

  • aircraft-war(五)

    aircraft-war(五) 大体上,这个游戏已经有了最初设计的样子,还差: Hero被敌机撞击会坠毁 游戏开始...

  • 四郎四郎傅四郎(四)

    上一章-南城(三) 第二章•无头女婴(一) 聚园柳庄内一私人别墅。 “四个,这是刚刚丁探长让人整理的和9...

  • 四(四)资源

    资源在MQL4程序中使用图形和声音 MQL4中的程序允许处理声音和图形文件:PlaySound() // 播放声...

  • 小 四 (四)

    这一次见面过后,又好多年没有见过小四。但是她三十岁那年,听到家里人又谈起了小四。 小四前两年又生了个女儿。由于她生...

网友评论

本文标题:aircraft-war(四)

本文链接:https://www.haomeiwen.com/subject/kfpomxtx.html