Cocos creater之物理引擎實現人物移動

根據上一章我們所講的物理引擎的基本應用和物理系統的碰撞檢測的知識後我們就能利用這些來實現類似於超級馬里奧那樣的人物角色移動，我這裏從網上找到了馬里奧的資源首先我們佈置好場景:

然後我們掛載game_scene到Canvas的根節點上來打開物理引擎世界並繪製調試區域（上篇文章講過這裏就不再掛代碼），再分別給這個角色和場景掛載物理剛體組件和碰撞器組件,然後配置我們的碰撞分組:

配置好後，我們運行看看:

OK，這裏運行成功說明我們的物理引擎已經打開，接下來我們要做的就是要實現這個人物在物理世界裏的移動和跳躍等操作,,首先我們創建一個player.js組件掛載到玩家的節點下:

打開之後就可以開始我們人物移動的代碼編寫，這裏我們實現角色移動是主要是通過監聽我們的鍵盤觸摸事件(第二篇已經講過)，並且這裏我們定義一個dir作爲方向：

//彈起

cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP,this.player_up().bind(this),this);
//按下

cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN,this.player_down().bind(this),this);

然後就是編寫我們的按鍵按下和彈起的方法:

//按下
  player_down(e){
        switch(e.keyCode) {
            case cc.macro.KEY.left:
                this.dir = -1;
            break;
            case cc.macro.KEY.right:
                this.dir = 1;
            break;
            case cc.macro.KEY.space:   
            console.log(cc.macro.KEY.space);
            this.jump(this.dir);
            break;   
        }
    },
  
//彈起
    player_up(e){
        switch(e.keyCode) {
            case cc.macro.KEY.left:
                this.dir = -1;
            break;
            case cc.macro.KEY.right:
                this.dir = 1;
            break;
            case cc.macro.KEY.space:
         
            break;
        }
    },

這裏我們設置鍵盤的左右來控制方向，按下空格來實現跳躍,通過改變物理剛體的線性速度來達到移動和跳躍的效果：

//改變剛體線性速度的y來跳躍  
jump(dir){
        var v = this.body.linearVelocity;
        v.y = dir * 600;
        this.body.linearVelocity = v;
    },
//改變剛體線性速度的x來移動
walk(dir){
        var v = this.body.linearVelocity;
        v.x = 300 * dir;
        this.body.linearVelocity = v;
        this.node.scaleX = dir;
   },

使用dir來控制方向，這裏我開始的時候先將dir設置爲0，讓它開始時處於靜止狀態,下面是完整代碼:

//玩家人物移動和跳躍

cc.Class({
    extends: cc.Component,
    properties: {
        
    },

     onLoad () {
        this.dir =  0; // 1爲向右 -1向左;
        this.body = this.node.getComponent(cc.RigidBody);
//彈起        cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP,this.player_up.bind(this),this);
//按下
cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN,this.player_down.bind(this),this);

     },

    player_down(e){
        switch(e.keyCode) {
            case cc.macro.KEY.left:
                this.dir = -1;
            break;
            case cc.macro.KEY.right:
                this.dir = 1;
            break;
            case cc.macro.KEY.space:   
            console.log(cc.macro.KEY.space);
            this.jump(this.dir);
            break;   
        }
    },
    
    player_up(e){
        switch(e.keyCode) {
            case cc.macro.KEY.left:
                this.dir = -1;
            break;
            case cc.macro.KEY.right:
                this.dir = 1;
            break;
            case cc.macro.KEY.space:
         
            break;
        }
    },

    jump(dir){
        var v = this.body.linearVelocity;
        v.y = dir * 600;
        this.body.linearVelocity = v;
    },
    walk(dir){
        var v = this.body.linearVelocity;
        v.x = 300 * dir;
        this.body.linearVelocity = v;
        this.node.scaleX = dir;
    },

     update (dt) {
         if(this.dir !== 0){ 
             this.walk(this.dir);
         }
     },
});

這樣我們就能實現人物的移動了。