美文网首页
cocos2d-js 事件

cocos2d-js 事件

作者: 写java的逗比叫z1 | 来源:发表于2017-09-04 23:02 被阅读0次

    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开发之旅 郑高强著 电子工业出版社

    相关文章

      网友评论

          本文标题:cocos2d-js 事件

          本文链接:https://www.haomeiwen.com/subject/frcyjxtx.html