creator小功能----浅谈creator物理引擎和cc.Camera组件，实现一个简单的马里奥游戏 | 附源码

物理引擎基本配置

开启物理引擎

cc.director.getPhysicsManager().enabled = true;  // 打开物理引擎

     cc.director.getPhysicsManager().debugDrawFlags 调试标志;

    var Bits = cc.PhysicsManager.DrawBits;

    cc.director.getPhysicsManager().debugDrawFlags = Bits.e_jointBit | Bits.e_shapeBit;

cc.PhysicsManager:

      enable: 开启   debugDrawFlags: 调试标志,   gravity: 重力加速度,二维向量

重力加速度

cc.director.getPhysicsManager().gravity = cc.p(0, -320);

物理刚体

刚体组件cc.RigidBoy:

      enabledContactListener: 是否开启碰撞事件的监听;

      bullet: 是否为子弹属性，防止高速穿越;

      allowSleep: 是否允许进入休眠状态，一段时间后如果物体没有任何状态改变会进入休眠状态;

      gravityScale: 该物体收重力的缩放;

      linearDamping: 线性阻尼，衰减线性速度;

      angularDamping: 角速度阻尼,衰减角速度;

      linearVelocity: 刚体的线性速度;

      angularVelocity: 刚体的角速度;

      fixedRotation: 是否固定不旋转;

      awake: 是否立刻唤醒此刚体;

      active: 是否激活这个刚体，如果不激活，那么刚体不会参与碰撞;

刚体碰撞器

物理形状的类型:

    矩形物理碰撞器;     圆形物理碰撞器;     多边形物理碰撞器;      链条碰撞器:  PhysicsChainCollider;

碰撞器的物理参数:

    Tag: 碰撞器的标记,区别一个节点上多个不同的碰撞器;

    Density: 相状的密度;

    Sensor: 是否为一个碰撞感应器;

    Friction: 摩擦系数;

    Restitution: 弹性系数[0, 1], 0没有弹性, 1完全弹性碰撞;

    Editing: 可以编辑碰撞器的形状;

cc.Class({
    extends: cc.Component,

    properties: {
        // foo: {
        //    default: null,      // The default value will be used only when the component attaching
        //                           to a node for the first time
        //    url: cc.Texture2D,  // optional, default is typeof default
        //    serializable: true, // optional, default is true
        //    visible: true,      // optional, default is true
        //    displayName: 'Foo', // optional
        //    readonly: false,    // optional, default is false
        // },
        // ...

        is_debug: false, // 是否显示调试信息;

        // 重力加速度是一个向量, 有方向的,2D, Vec重力加速度的大小;
        gravity: cc.p(0, -320), // 系统默认的
    },

    // use this for initialization
    onLoad: function () {
        // 游戏引擎的总控制
        // cc.Director, cc.director 区别呢？
        // 大写的cc.Director是一个类, 小写cc.direcotr全局的实例
        cc.director.getPhysicsManager().enabled = true; // 开启了物理引擎
        // 独立的形状，打开一个调试区域,游戏图像的，逻辑区域;
        // 开始调试模式:
        if (this.is_debug) { // 开启调试信息
            var Bits = cc.PhysicsManager.DrawBits; // 这个是我们要显示的类型
            cc.director.getPhysicsManager().debugDrawFlags = Bits.e_jointBit | Bits.e_shapeBit;
        }
        else { // 关闭调试信息
            cc.director.getPhysicsManager().debugDrawFlags = 0;
        }
        // 重力加速度的配置
        cc.director.getPhysicsManager().gravity = this.gravity;
    },

    // called every frame, uncomment this function to activate update callback
    // update: function (dt) {

    // },
});

物理引擎碰撞检测

物体类型与碰撞矩阵

添加物体类型: Add Layer, 每个类型对应一个名字group与groupIndex

碰撞事件监听

在需要检测碰撞的组件代码里面编写碰撞响应函数:

     onBeginContact ( contact, selfCollider, otherCollider): 碰撞开始

     onEndContact (contact, selfCollider, otherCollider): 碰撞结束

     onPreSolve(contact, selfCollider, otherCollider); 碰撞持续,接触时被调用;

     onPostSolve (contact, selfCollider, otherCollider);  碰撞接触更新完后调用,可以获得冲量信息

如果把碰撞器设置成了sensor,那么只会做碰撞检测，而不会改变物体碰撞后的运动状态;     sensor: 用于触发器: 道具, 关卡的出口，入口等;

cc.Class({
    extends: cc.Component,

    properties: {
        // foo: {
        //    default: null,      // The default value will be used only when the component attaching
        //                           to a node for the first time
        //    url: cc.Texture2D,  // optional, default is typeof default
        //    serializable: true, // optional, default is true
        //    visible: true,      // optional, default is true
        //    displayName: 'Foo', // optional
        //    readonly: false,    // optional, default is false
        // },
        // ...
    },

    // use this for initialization
    onLoad: function () {

    },

    // contact 是碰撞对象,本次碰撞的信息
    // selfCollider: 是自己的碰撞器组件
    // otherCollider: 碰撞到的碰撞器组件;
    // 我们可以有碰撞器组件，来获取我们的碰撞的节点对象
    // 碰撞开始
    onBeginContact: function ( contact, selfCollider, otherCollider) {
        console.log("onBeginContact:", otherCollider.node.name, " ", selfCollider.node.name);
        console.log("onBeginContact", selfCollider.node.group, otherCollider.node.group);
        console.log("onBeginContact", selfCollider.node.groupIndex, otherCollider.node.groupIndex);
    },

    // 碰撞结束
    onEndContact: function(contact, selfCollider, otherCollider) {
        console.log("onEndContact");
    },

    // 碰撞持续
    onPreSolve: function(contact, selfCollider, otherCollider) {
        console.log("onPreSolve function");
    },

    // 计算完本次碰撞持续后，调用这个
    onPostSolve: function (contact, selfCollider, otherCollider) {
        console.log("onPostSolve");
    }
    // called every frame, uncomment this function to activate update callback
    // update: function (dt) {

    // },
});

监听键盘消息:

cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.on_key_down.bind(this), this);                      cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, this.on_key_up.bind(this), this);

cc.Camera组件：

设置cc.Camera组件,设置Camera跟随玩家;

配置哪些物体受Camera组件影响;

     Targets: 受Camera影响的物体的集合;

配置Camera跟随目标:

    var w_pos = this.target.convertToWorldSpaceAR(cc.p(0, 0));

    var pos = this.node.parent.convertToNodeSpaceAR(w_pos);

//--------bind_camera.js---------
cc.Class({
    extends: cc.Component,

    properties: {
        // foo: {
        //    default: null,      // The default value will be used only when the component attaching
        //                           to a node for the first time
        //    url: cc.Texture2D,  // optional, default is typeof default
        //    serializable: true, // optional, default is true
        //    visible: true,      // optional, default is true
        //    displayName: 'Foo', // optional
        //    readonly: false,    // optional, default is false
        // },
        // ...
        target: {
            default: null,
            type: cc.Node,
        },
    },

    // use this for initialization
    onLoad: function () {

    },

    // called every frame, uncomment this function to activate update callback
    update: function (dt) {
        if (this.target === null) {
            return;
        }
        // target到哪里, camera跟到哪里
        var wpos = this.target.convertToWorldSpaceAR(cc.p(0, 0));
        var pos = this.node.parent.convertToNodeSpaceAR(wpos);
        // this.node.setPosition(pos);
        this.node.x = pos.x;
    },
});








//------------hero.js----------------
// 键盘,水平移动,左右
// 跳跃为空给

cc.Class({
    extends: cc.Component,

    properties: {
        // foo: {
        //    default: null,      // The default value will be used only when the component attaching
        //                           to a node for the first time
        //    url: cc.Texture2D,  // optional, default is typeof default
        //    serializable: true, // optional, default is true
        //    visible: true,      // optional, default is true
        //    displayName: 'Foo', // optional
        //    readonly: false,    // optional, default is false
        // },
        // ...
        body: {
            type: cc.RigidBody,
            default: null,
        },
    },

    // use this for initialization
    onLoad: function () {
        // 代码获取
        // this.body = this.ndoe.getComponent(cc.RigidBody);
        // end 
        cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.on_key_down.bind(this), this);
        cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, this.on_key_up.bind(this), this);

        this.input_flag = 0;
    },

    jump: function() {
        var v = this.body.linearVelocity;
        v.y = 600;
        this.body.linearVelocity = v;
    },

    // -1, 1
    walk: function(dir) {
        var v = this.body.linearVelocity;
        v.x = 300 * dir;
        this.body.linearVelocity = v;
        this.node.scaleX = dir;
    },

    on_key_down: function(e) {
        switch(e.keyCode) {
            case cc.KEY.left:
                this.input_flag = -1;
            break;
            case cc.KEY.right:
                this.input_flag = 1;
            break;

            case cc.KEY.space:
                this.jump();
            break;
        }
    },

    on_key_up: function(e) {
        switch(e.keyCode) {
            case cc.KEY.left:
                this.input_flag = 0;
            break;
            case cc.KEY.right:
                this.input_flag = 0;
            break;
            case cc.KEY.space:
            break;
        }
    },  

    // called every frame, uncomment this function to activate update callback
    update: function (dt) {
        if (this.input_flag !== 0) {
            this.walk(this.input_flag);
        }
    },
});

源码下载地址