1. 程式人生 > >cocos creator學習11——碰撞檢測系統

cocos creator學習11——碰撞檢測系統

碰撞分組

cocos creator中新版本中的碰撞分組功能,能夠使開發者更方便地管理碰撞檢測
這次我使用飛機大戰的專案進行詳細介紹
碰撞分組
點選編輯可以管理碰撞元件的檢測
碰撞分組
cocos引擎會根據碰撞分組配對,進行相應的檢測
如上圖,子彈組會與enemy組進行碰撞檢測,hero會與enemy組進行碰撞檢測

為節點新增碰撞檢測元件

元件
可以選擇Editing屬性對碰撞區域進行編輯

開啟碰撞檢測

cc.director.getCollisionManager().enabled=true; 這是一個全域性屬性,開啟後就代表碰撞檢測元件可以進行檢測了
cc.director.getCollisionManager().enabledDebugDraw = true;

繪製碰撞區域

碰撞事件響應函式

開啟了碰撞檢測後,每一次碰撞組的碰撞就會在節點的元件中查詢碰撞響應函式

響應函式 響應事件
onCollisionEnter:function(other,self) 碰撞開始事件(第一次接觸)
onCollisionStay:function(other,self) 碰撞持續事件(元件相交)
onCollisionExit:function(other,self) 碰撞結束事件(離開的一瞬間)

other引數是指與這個元件碰撞的碰撞器元件
self引數是指自身的碰撞器元件

實戰測試

1、分組

子彈分組
敵人分組

2、開啟碰撞檢測

 onLoad() {
        cc.director.getCollisionManager().enabled=true;
     //   cc.director.getCollisionManager().enabledDrawBoundingBox = true;
     //開啟繪製區域
       cc.director.getCollisionManager().enabledDebugDraw = true;
        cc.log(this.score);
    },

3、編寫碰撞事件函式

由於我們只需要子彈碰到敵機一下就可以了,因此只使用了onCollisionEnter

響應函式
enemyfly.js

 onCollisionEnter:function(other,self){              //碰撞則播放爆炸動畫
        if (other.node.group != 'bullet'){
            cc.log("bullet");
            return ;
        }
        if(other.node.group == 'bullet') //檢測碰撞組
        {   
            other.node.removeFromParent();
            this.hp -= 1;
            if(this.hp == 0 )
            {
              //  enemyReq.add_Score();
                 this.node.group = 'default'; //防止播放爆炸動畫時繼續檢測導致神奇的事情發生
                 var en = this.node.getComponent(cc.Animation);
                 var na = this.node.name;
                en.play(na+"_des"); //播放動畫
                 en.on('finished',function(e){
                        this.node.removeFromParent();
                       // var score = this.node.getComponent(cc.Label);   
                 },this); 
            }
        }
    },

遊戲效果

遊戲效果