觸摸事件

1: 觸摸事件類型: START, MOVED, ENDED(物體內(nèi)), CANCEL(物體外);
2: 監(jiān)聽觸摸事件: node.on(類型, callback, target(回掉函數(shù)的this), [useCapture]);
3: 關(guān)閉觸摸事件: node.off(類型, callback, target(回掉函數(shù)的this), [useCapture]);
4: targetOff (target): 移除所有的注冊事件;
5: 回掉函數(shù)的參數(shù)設(shè)置 function(t(cc.Touch))
6: cc.Touch: getLocation返回觸摸的位置;getDelta返回距離上次的偏移;
7: cc.Event: stopPropagationImmediate/stopPropagation 停止事件的傳遞;
8: 事件冒泡: 觸摸事件支持節(jié)點樹的事件冒泡,會從當前前天往上一層一層的向父節(jié)點傳送;
9: 完成物體跟隨手指觸摸的案例;

const {ccclass, property} = cc._decorator;

@ccclass
export default class NewClass extends cc.Component {

    // LIFE-CYCLE CALLBACKS:

    onLoad ()
     {
        this.addListenerTouchEvent();
     }

    start () {

    }

    // update (dt) {}

    addListenerTouchEvent(){
        this.node.on(cc.Node.EventType.TOUCH_START,this.touchStart,this);
        this.node.on(cc.Node.EventType.TOUCH_MOVE,this.touchMove,this);
        this.node.on(cc.Node.EventType.TOUCH_END,this.touchEnd,this);
        this.node.on(cc.Node.EventType.TOUCH_CANCEL,this.touchCancle,this);
    }

    touchStart(touch){
        console.log("當手指觸摸到屏幕時。");
        
    }
    touchMove(touch){
        console.log("當手指在屏幕上移動時。");
    }
    touchEnd(touch){
        console.log("觸摸結(jié)當手指在目標節(jié)點區(qū)域內(nèi)離開屏幕時束");
    }
    touchCancle(touch){
        console.log("當手指在目標節(jié)點區(qū)域外離開屏幕時");
    }
    
}

鍵盤事件

1:cc.SystemEvent.on(type, function, target, useCapture);
type: cc.SystemEvent.EventType.KEY_DOWN 按鍵按下;
cc.SystemEvent.EventType.KEY_UP 按鍵彈起;
2: cc.SystemEvent.on(type, function, target, useCapture);
3: 監(jiān)聽的時候，我們需要一個cc.SystemEvent類的實例，我們有一個全局的實例cc.systemEvent,小寫開頭
3: 鍵盤回掉函數(shù): function(event) {
event.keyCode [cc.KEY.left, ...cc.KEY.xxxx]

const {ccclass, property} = cc._decorator;

@ccclass
export default class Helloworld extends cc.Component {
    onLoad(){
        this.addListenerKeyBoardAction();
    }

    start(){
        this.node.emit('say-hello','hello******','123465');
    }


    onDestroy(){
        this.deleteListenerKeyBoardAction();
    }


    //添加鍵盤監(jiān)聽事件
    addListenerKeyBoardAction(){
        cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN,this.onKeyDown)
        cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP,this.onKeyUp)
    }
    //移除鍵盤監(jiān)聽事件
    deleteListenerKeyBoardAction(){
        cc.systemEvent.off(cc.SystemEvent.EventType.KEY_DOWN,this.onKeyDown)
        cc.systemEvent.off(cc.SystemEvent.EventType.KEY_UP,this.onKeyUp)
    }

    onKeyDown(event){
        switch(event.keyCode){
            case cc.macro.KEY.a:
                console.log("A鍵按下");
                break;
            case cc.macro.KEY.d:
                console.log("D鍵按下");
                break;
            case cc.macro.KEY.w:
                console.log("W鍵按下");
                break;
            case cc.macro.KEY.s:
                console.log("S鍵按下");
                break;
        }
    }

    onKeyUp(event){
        switch(event.keyCode){
            case cc.macro.KEY.a:
                console.log("A鍵抬起");
                break;
            case cc.macro.KEY.d:
                console.log("D鍵抬起");
                break;
            case cc.macro.KEY.w:
                console.log("W鍵抬起");
                break;
            case cc.macro.KEY.s:
                console.log("S鍵抬起");
                break;
        }
    }
}

自定義事件

1:監(jiān)聽: this.node.on(“自定義事件名稱”, function, target, useCapture);
2: 自派送: emit(“事件名稱”, [detail]); 只有自己能夠收到;
3: 冒泡派送: dispatchEvent(new cc.Event.EventCustom(“name”, 是否冒泡傳遞));
監(jiān)聽事件
事件處理是在節(jié)點(cc.Node)中完成的.對于組件，可以通過訪問節(jié)點this.node來注冊和監(jiān)聽事件。
監(jiān)聽事件可以通過this.node.on()函數(shù)來注冊事件
監(jiān)聽事件可以通過this.node.off()函數(shù)來關(guān)閉事件

發(fā)射事件
我們可以通過兩種方式發(fā)射事件：emit 和 dispatchEvent。兩者的區(qū)別在于，后者可以做事件傳遞。 我們先通過一個簡單的例子來了解 emit 事件

const {ccclass, property} = cc._decorator;

@ccclass
export default class Helloworld extends cc.Component {
    onLoad(){
        this.node.on('say-hello',(msg)=>{console.log(msg) })
    }

    start(){
        this.node.emit('say-hello','hello******','123465');
    }
}

運行結(jié)果

emit會將第二個參數(shù)位置的"hello******"打印出來
需要說明的是，出于底層事件派發(fā)的性能考慮，這里最多只支持傳遞 5 個事件參數(shù)。所以在傳參時需要注意控制參數(shù)的傳遞個數(shù)
再看另外一個例子

const {ccclass, property} = cc._decorator;

@ccclass
export default class Helloworld extends cc.Component {
    onLoad(){
        this.node.on('foo',(arg1,arg2,arg3)=>{console.log(arg1,arg2,arg3)})
    }

    start(){
        let arg1  =1,arg2 = 2,arg3 = 3;
        this.node.emit('foo',arg1,arg2,arg3);
    }
}

運行結(jié)果

通過dispatchEvent 方法發(fā)射的事件，會進入事件派送階段。在 Cocos Creator 的事件派送系統(tǒng)中，我們采用冒泡派送的方式。冒泡派送會將事件從事件發(fā)起節(jié)點，不斷地向上傳遞給他的父級節(jié)點，直到到達根節(jié)點或者在某個節(jié)點的響應函數(shù)中做了中斷處理 event.stopPropagation()。

bubble-event

如上圖所示，當我們從節(jié)點 c 發(fā)送事件 “foobar”，倘若節(jié)點 a，b 均做了 “foobar” 事件的監(jiān)聽，則 事件會經(jīng)由 c 依次傳遞給 b，a 節(jié)點。如：

// 節(jié)點 c 的組件腳本中
this.node.dispatchEvent( new cc.Event.EventCustom('foobar', true) );

如果我們希望在 b 節(jié)點截獲事件后就不再將事件傳遞，我們可以通過調(diào)用 event.stopPropagation() 函數(shù)來完成。具體方法如下：

// 節(jié)點 b 的組件腳本中
this.node.on('foobar', function (event) {
  event.stopPropagation();
});

請注意，在發(fā)送用戶自定義事件的時候，請不要直接創(chuàng)建 cc.Event 對象，因為它是一個抽象類，請創(chuàng)建 cc.Event.EventCustom 對象來進行派發(fā)。