I started to learn cocos a few days ago and I don't really understand how to use the eventListener, I tried to copy the example code in their documentation website and make it so that instead of moving with the WASD keys you'll move by touching the screen, I tried to add it to the code but it didn't work... this is my code
cc.Class({
extends: cc.Component,
properties: {
// foo: {
// // ATTRIBUTES:
// default: null, // The default value will be used only
when the component attaching
// // to a node for the first time
// type: cc.SpriteFrame, // optional, default is typeof default
// serializable: true, // optional, default is true
// },
// bar: {
// get () {
// return this._bar;
// },
// set (value) {
// this._bar = value;
// }
// },
},
// Player.js
//...
properties: {
// main character's jump height
jumpHeight: 0,
// main character's jump duration
jumpDuration: 0,
// maximal movement speed
maxMoveSpeed: 0,
// acceleration
accel: 0,
},
//...
setJumpAction: function jump() {
// jump up
var jumpUp = cc.moveBy(this.jumpDuration, cc.p(0,
this.jumpHeight)).easing(cc.easeCubicActionOut());
// jump down
var jumpDown = cc.moveBy(this.jumpDuration, cc.p(0, -
this.jumpHeight)).easing(cc.easeCubicActionIn());
// repeat
return cc.sequence(jumpUp, jumpDown);
},
setInputControl: function () {
var self = this;
// add keyboard event listener
// When there is a key being pressed down, judge if it's the
designated directional button and set up acceleration in the corresponding
direction
cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, function
(event) {
switch (event.keyCode) {
case cc.KEY.a:
self.accLeft = true;
break;
case cc.KEY.d:
self.accRight = true;
break;
case cc.KEY.w:
self.accUp = true;
break;
}
});
// when releasing the button, stop acceleration in this direction
cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, function (event) {
switch (event.keyCode) {
case cc.KEY.a:
self.accLeft = false;
break;
case cc.KEY.d:
self.accRight = false;
break;
case cc.KEY.w:
self.accUp = false;
break;
}
});
},
setTouchControl: function () {
//Create a "one by one" touch event listener (processes one touch at a time)
var listener1 = cc.EventListener.create({
event: cc.EventListener.TOUCH_ONE_BY_ONE,
// When "swallow touches" is true, then returning 'true' from the onTouchBegan method will "swallow" the touch event, preventing other listeners from using it.
swallowTouches: true,
//onTouchBegan event callback function
onTouchBegan: function (touch, event) {
var x = touch.getLocationX();
var y = touch.getLocationY();
},
//Trigger when moving touch
onTouchMoved: function (touch, event) {
//Move the position of current button sprite
var x = touch.getLocationX();
var y = touch.getLocationY();
},
//Process the touch end event
onTouchEnded: function (touch, event) {
var x = touch.getLocationX();
var y = touch.getLocationY();
}
});
cc.systemEvent.addListener(listener1, this.node);
cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, function (event) {
switch (event.keyCode) {
case cc.KEY.a:
self.accLeft = false;
break;
case cc.KEY.d:
self.accRight = false;
break;
case cc.KEY.w:
self.accUp = false;
break;
}
});
},
// Player.js
onLoad: function () {
// initialize jump action
this.jumpAction = this.setJumpAction();
this.node.runAction(this.jumpAction);
// switch of acceleration direction
this.accLeft = false;
this.accRight = false;
this.accUp = false;
// current horizontal speed of main character
this.xSpeed = 0;
this.ySpeed = 0;
// initialize keyboard input listener
this.setInputControl();
this.setTouchControl();
},
// LIFE-CYCLE CALLBACKS:
// onLoad () {},
start() {
},
// update (dt) {},
// Player.js
update: function (dt) {
// update speed of each frame according to the current acceleration direction
if (this.accLeft) {
this.xSpeed -= this.accel * dt;
} else if (this.accRight) {
this.xSpeed += this.accel * dt;
}
// restrict the movement speed of the main character to the maximum movement speed
if (Math.abs(this.xSpeed) > this.maxMoveSpeed) {
// if speed reaches its limit, use the max speed with current direction
this.xSpeed = this.maxMoveSpeed * this.xSpeed / Math.abs(this.xSpeed);
}
// update the position of the main character according to the current speed
this.node.x = this.x;
},
});
I tried to use the function setTouchControl for my porpuses but I don't even know if it's good and if so how to use it in code...
ok, I found the answer... here:
properties: {
},
onLoad () {
this.node.on('touchstart', function(){
}, this.node);
this.node.on('touchmove', function (event) {
var delta = event.touch.getDelta();
this.x += delta.x;
this.y += delta.y;
}, this.node);
this.node.on('touchend', function () {
}, this.node);
},