cocos2d-js 事件

1. 鼠标事件

使用cc.eventManager.addListener监听鼠标事件

cc.eventManager.addListener({
    event:cc.EventListener.MOUSE,  // 表示监听鼠标事件
    onMouseDown:function (event) {     // 监听鼠标按下
    },
    onMouseMove:function (event) {    // 鼠标移动
    },
    onMouseUp:function (event) {     //  鼠标弹起
    }
},node);

addListener接收两个参数，第一个参数是监听信息对象，第二个是监听的节点

判断当前平台是否有鼠标事件
'mouse' in cc.sys.capabilities;

var MouseEventLayer = cc.Layer.extend({
   ctor:function () {
       this._super();

       if('mouse' in cc.sys.capabilities) {
           cc.eventManager.addListener({
               event: cc.EventListener.MOUSE,
               onMouseDown:function(event){
                   var pos = event.getLocation();
                   var target = event.getCurrentTarget();
                   if(event.getButton() === cc.EventMouse.BUTTON_LEFT) {
                       console.log("LEFT BUTTON click at : " + pos.x+":"+pos.y);
                   } else if(event.getButton() === cc.EventMouse.BUTTON_RIGHT) {
                       console.log("RIGHT BUTTON click at : " + pos.x+":"+pos.y);
                   } else if(event.getButton() === cc.EventMouse.BUTTON_MIDDLE) {
                       console.log("MIDDLE BUTTON click at : " + pos.x+":"+pos.y);
                   } else if(event.getButton() === cc.EventMouse.BUTTON_4) {
                       console.log("MIDDLE 4 click at : " + pos.x+":"+pos.y);
                   } else if(event.getButton() === cc.EventMouse.BUTTON_5) {
                       console.log("MIDDLE 5 click at : " + pos.x+":"+pos.y);
                   } else if(event.getButton() === cc.EventMouse.BUTTON_6) {
                       console.log("MIDDLE 6 click at : " + pos.x+":"+pos.y);
                   } else if(event.getButton() === cc.EventMouse.BUTTON_7) {
                       console.log("MIDDLE 7 click at : " + pos.x+":"+pos.y);
                   } else if(event.getButton() === cc.EventMouse.BUTTON_8) {
                       console.log("MIDDLE 8 click at : " + pos.x+":"+pos.y);
                   }
               },
               onMouseMove : function (event) {
                   var pos = event.getLocation();
                   var target = event.getCurrentTarget();
                   console.log("Moving at : " + pos.x+":"+pos.y);
               },
               onMouseUp : function (event) {
                   var pos = event.getLocation();
                   var target = event.getCurrentTarget();
                   console.log("Up at : " + pos.x+":"+pos.y);
               }
           },this);
       } else {
           console.log("当前平台不支持鼠标");
       }
       return true;
   }
});

event参数是个对象，包含多个常用方法

• event.getLocation : 获取事件发生的坐标
• event.getLocationX/getLocationY ： 获取一个值
• event.getCurrentTarget: 获取当前处理鼠标事件的对象，也就是cc.eventManager.addListener传的第二个参数
• event.getButton : 获取单击事件的键值
• event.getDelta: 在onMouseMove事件处理函数中有效，获取本次移动的偏移值
• event.getDeltaX/getDeltaY: 获取数值

2.触摸事件

1. 单点触摸

使用cc.eventManager.addListener监听单点触摸

var TouchEventLayer = cc.Layer.extend({
    ctor:function () {
        this._super();

        if('touches' in cc.sys.capabilities) {  //判断当前系统是否支持触摸
            cc.eventManager.addListener({
                event: cc.EventListener.TOUCH_ONE_BY_ONE,
                onTouchBegan:this.onTouchBegan,
                onTouchMoved : this.onTouchMoved,
                onTouchEnded :this.onTouchEnded,
                onTouchCancelled:this.onTouchCancelled
            },this);
        } else {
            console.log("当前平台不支持触摸");
        }

        return true;
    },
    onTouchBegan:function(touch,event){
        var pos = touch.getLocation();
        var id = touch.getID();
        console.log("onTouchBegan at : " + pos.x+":"+pos.y);
        var winSize = cc.director.getWinSize();
        if(pos.x < winSize/2){
            return true;   // 本次触摸是否生效，如果返回false，后续的moved和ended讲不再触发
        }
        return false;
    },
    onTouchMoved : function (touch,event) { // touch表示触摸对象
        var pos = touch.getLocation();
        var id = touch.getID();
        console.log("onTouchMoved at : " + pos.x+":"+pos.y);
    },
    onTouchEnded : function (touch,event) {
        var pos = touch.getLocation();
        var id = touch.getID();
        console.log("onTouchEnded at : " + pos.x+":"+pos.y);
    },
    onTouchCancelled:function (touch,event) {
        var pos = touch.getLocation();
        var id = touch.getID();
        console.log("onTouchCancelled at : " + pos.x+":"+pos.y);
    }
})

2.多点触摸

cc.eventManager.addListener({
    event:cc.EventListener.TOUCH_ALL_AT_ONCE,  // 表示监听多点事件
    onTouchesBegan : function(touches,event) {     // 触摸开始
    },
    onTouchesMoved : function(touches,event) {    // 触摸移动
    },
    onTouchEnded : function (touches,event) {     //  触摸结束
    },
    onTouchCancelled : function(touches,event){  // 触摸取消
    }
},node);

touches对象是一个数组，每个数组元素是一个touch对象
onTouchBegan不需要返回true/false，无法控制是否接触受本次触摸

3. 键盘事件

var KeyboardEventLayer = cc.Layer.extend({
    ctor:function () {
        this._super();
        if('keyboard' in cc.sys.capabilities) {
            cc.eventManager.addListener({
                event:cc.EventListener.KEYBOARD,
                onKeyReleased : function (keyCode,event) {
                    console.log("release " + keyCode);
                },
                onKeyPressed : function (keyCode,event) {
                    console.log("press "+ keyCode);
                }
            },this);
        } else {
            console.log("当前平台不支持键盘");
        }
    }
})

onKeyReleased 表示按下放开
onKeyPressed 表示按下
keyCode是一个数字

cc.KEY = {
    none:0,

    // android
    back:6,
    menu:18,

    // desktop
    backspace:8,
    tab:9,

    enter:13,

    shift:16, //should use shiftkey instead
    ctrl:17, //should use ctrlkey
    alt:18, //should use altkey
    pause:19,
    capslock:20,

    escape:27,
    space:32,
    pageup:33,
    pagedown:34,
    end:35,
    home:36,
    left:37,
    up:38,
    right:39,
    down:40,
    select:41,

    insert:45,
    Delete:46,
    0:48,
    1:49,
    2:50,
    3:51,
    4:52,
    5:53,
    6:54,
    7:55,
    8:56,
    9:57,
    a:65,
    b:66,
    c:67,
    d:68,
    e:69,
    f:70,
    g:71,
    h:72,
    i:73,
    j:74,
    k:75,
    l:76,
    m:77,
    n:78,
    o:79,
    p:80,
    q:81,
    r:82,
    s:83,
    t:84,
    u:85,
    v:86,
    w:87,
    x:88,
    y:89,
    z:90,

    num0:96,
    num1:97,
    num2:98,
    num3:99,
    num4:100,
    num5:101,
    num6:102,
    num7:103,
    num8:104,
    num9:105,
    '*':106,
    '+':107,
    '-':109,
    'numdel':110,
    '/':111,
    f1:112, //f1-f12 don't work on ie
    f2:113,
    f3:114,
    f4:115,
    f5:116,
    f6:117,
    f7:118,
    f8:119,
    f9:120,
    f10:121,
    f11:122,
    f12:123,

    numlock:144,
    scrolllock:145,

    ';':186,
    semicolon:186,
    equal:187,
    '=':187,
    ',':188,
    comma:188,
    dash:189,
    '.':190,
    period:190,
    forwardslash:191,
    grave:192,
    '[':219,
    openbracket:219,
    backslash:220,
    ']':221,
    closebracket:221,
    quote:222,

    // gamepad control
    dpadLeft:1000,
    dpadRight:1001,
    dpadUp:1003,
    dpadDown:1004,
    dpadCenter:1005
};

4.重力感应事件

var AccelerometerLayer = cc.Layer.extend({
    ctor:function () {
        this._super();
        var winSize = cc.director.getWinSize();

        if('accelerometer' in cc.sys.capabilities){
            cc.inputManager.setAccelerometerInterval(1/30); //设置重力感应的频率
            cc.inputManager.setAccelerometerEnabled(true);
            cc.eventManager.addListener({
                event:cc.EventListener.ACCELERATION,
                callback:function (accelerometerInfo,event) {
                    var target = event.getCurrentTarget();
                    console.log("x:"+accelerometerInfo.x+" y:"+accelerometerInfo.y + " z:"+accelerometerInfo.z);

                    var w = winSize.width;
                    var h = winSize.height;

                    var x = w*accelerometerInfo.x + w/2;
                    var y = h*accelerometerInfo.y + h/2;

                    x = x*0.2 + target.prevX*0.8; //小球慢慢移动到目标位置
                    y = y*0.2 + target.prevY*0.8;

                    target.prevX = x;
                    target.prevY = y;
                    target.sprite.x = x;
                    target.sprite.y = y;
                }
            },this);

            var sprite = this.sprite = new cc.sprite("res/item_2.png");
            this.addChild(sprite);
            sprite.x = winSize.width/2;
            sprite.y = winSize.height/2;

            this.prevX = 0;
            this.prevY = 0;

        } else {
            console.log("当前平台不支持重力感应");
        }
    }
})

5. 游戏进入后台/恢复显示事件

cc.eventManager.addCustomListener(cc.game.EVENT_HIDE,function () {
            //游戏进入后台
        });
        cc.eventManager.addCustomListener(cc.game.EVENT_SHOW,function () {
            //游戏恢复显示
        });

参考资料 Cocos2d-JS开发之旅 郑高强著 电子工业出版社