天天看點

微信小遊戲-CocosCreator 基礎(三)

 // cc.Node.EventType.TOUCH_START: 觸摸開始

        // cc.Node.EventType.TOUCH_MOVE: 觸摸移動

        // cc.Node.EventType.TOUCH_END: 觸摸結束, (物體内部結束)

        // cc.Node.EventType.TOUCH_CANCEL: 觸摸結束, (物體外部結束)

this.node.on(cc.Node.EventType.TOUCH_START,function (e)

{

       e=cc.TOUCH

        有bind則aaa=this

}.bind(aaa),XXX);// XXX 為傳入的參數,回調函數可以使用  

cc.Event.EventTouch:查詢api

多點觸控

事件冒泡:事件向上傳遞=》父子節點,父節點也會監聽到事件

======================================

觸摸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

        // },

        // ...

    },

    on_touch_move: function(t) {

        // 位置

        console.log("cc.Node.EventType.TOUCH_MOVE called");

        console.log(t.getLocation());

        var w_pos = t.getLocation(); // cc.Vec2 {x, y}

        console.log(w_pos, w_pos.x, w_pos.y);

        // 距離上一次觸摸變化了多少;

        var delta = t.getDelta(); // x, y各變化了多少cc.Vec2(x, y)

        this.node.x += delta.x;

        this.node.y += delta.y;

    },

    // use this for initialization

    onLoad: function () {

        // (1) 監聽對應的觸摸事件: 像引擎底層注冊一個回掉函數,當有觸摸事件發生的時候掉這個回掉函數;

        // cc.Node.EventType.TOUCH_START: 觸摸開始

        // cc.Node.EventType.TOUCH_MOVE: 觸摸移動

        // cc.Node.EventType.TOUCH_END: 觸摸結束, (物體内部結束)

        // cc.Node.EventType.TOUCH_CANCEL: 觸摸結束, (物體外部結束)

        this.node.on(cc.Node.EventType.TOUCH_START, function(t) {

            console.log("cc.Node.EventType.TOUCH_START called");

            // this 函數裡面的this,

            // 停止事件傳遞

            t.stopPropagationImmediate(); 

        }, this);

        this.node.on(cc.Node.EventType.TOUCH_MOVE, this.on_touch_move, this);

        this.node.on(cc.Node.EventType.TOUCH_END, function(t) {

            console.log("cc.Node.EventType.TOUCH_END called");

        }, this);

        this.node.on(cc.Node.EventType.TOUCH_CANCEL, function(t) {

            console.log("cc.Node.EventType.TOUCH_CANCEL called");

        }, this);

        // 移除

        // this.node.off(cc.Node.EventType.TOUCH_MOVE, this.on_touch_move, this);

        // 移除target上所有的注冊事件

        // this.node.targetOff(this);

    },

    // called every frame, uncomment this function to activate update callback

    // update: function (dt) {

    // },

});

===================================================

鍵盤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

        // },

        // ...

    },

    // use this for initialization

    // (1)向引擎注冊一個事件類型的回掉函數, 

    // (2) 按鍵時間的類型: cc.SystemEvent.EventType.KEY_DOWN, cc.SystemEvent.EventType.KEY_UP;

    // (3) 配置的回掉函數: function(event) {} target, 目标

    // (4) 每一個按鍵,都會對應一個按鍵碼, space, A, B, C, event對象 event.keyCode;

    // (5) cc.systemEvent 小寫開頭,不是大寫, 大寫SystemEvent類, systemEvent 全局一個執行個體

    onLoad: function () {

        // console.log(cc.systemEvent);

        // 按鍵被按下

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

        // 按鍵彈起

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

    },

    on_key_down: function(event) {

        switch(event.keyCode) {

            case cc.KEY.space:

                console.log("space key down!");

            break;

        }

    },

    on_key_up: function(event) {

        switch(event.keyCode) {

            case cc.KEY.space:

                console.log("space key up!");

            break;

        }

    },

    // called every frame, uncomment this function to activate update callback

    // update: function (dt) {

    // },

});

=================================================

自定義:接收者,派發者

emit(xxx,aaa) aaa==detail

 子節點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

        // },

        // ...

    },

    // use this for initialization

    onLoad: function () {

        // 接收者

        // 事件類型,是你自定義的字元串;

        // 回掉函數: function(e) {} e--> cc.Event.EventCustom的執行個體

        // end

    },

    start: function() {

        // 派發者,隻能傳遞給自己,不會向上傳遞

        this.node.emit("pkg_event", {blake: "huang"});

        // end  

        // 派送者,不隻是發給自己,發給我們這個體系;

        // true/false, true向上傳遞, false不向向上傳遞

        var e = new cc.Event.EventCustom("pkg_event", true);

        e.detail = {blake: "huang"};

        this.node.dispatchEvent(e);

    },

    // called every frame, uncomment this function to activate update callback

    // update: function (dt) {

    // },

});

 父節點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

        // },

        // ...

    },

    // use this for initialization

    onLoad: function () {

        this.node.on("pkg_event", function(e){

            console.log("recv pkg_event", e.detail);

        }, this);

    },

    // called every frame, uncomment this function to activate update callback

    // update: function (dt) {

    // },

});

繼續閱讀