cc里面的pos怎么处理(cocos creator基础-ccNode(二)事件响应)

触摸事件

1: 触摸事件类型: START, MOVED, ENDED(物体内), CANCEL(物体外);

2: 监听触摸事件: node.on(类型, callback, target(回掉函数的this), [useCapture]);

3: 关闭触摸事件: node.off(类型, callback, target(回掉函数的this), [useCapture]);

4: targetOff (target): 移除所有的注册事件;

5: 回掉函数的参数设置 function(t(cc.Touch))

6: cc.Touch: getLocation返回触摸的位置;getDelta返回距离上次的偏移;

7: cc.Event: stopPropagationImmediate/stopPropagation 停止事件的传递;

8: 事件冒泡: 触摸事件支持节点树的事件冒泡,会从当前前天往上一层一层的向父节点传送;

9: 完成物体跟随手指触摸的案例;

// touch事件

cc.Class({

extends: cc.Component,

properties: {

},

/*

t: --> cc.Touch

触摸的位置: 屏幕坐标，左小角(0, 0); getLocation();

*/

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: 触摸结束, (物体外部结束)

/*

(2) 回掉函数的格式 function(t) --> cc.Touch对象触摸事件对象 {触摸信息，事件信息}

call --> this, this指向谁就是这个target;你要绑那个对象作为你回掉函数的this, 可以为空

function () {}.bind(this);

*/

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) {

// },

});

键盘事件

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: 监听的时候，我们需要一个cc.SystemEvent类的实例，我们有一个全局的实例cc.systemEvent,小写开头

3: 键盘回掉函数: function(event) {

event.keyCode [cc.KEY.left, ...cc.KEY.xxxx]

// kb_event.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) {

// },

});

自定义事件

1:监听: this.node.on(“自定义事件名称”, function, target, useCapture);

2: 自派送: emit(“事件名称”, [detail]); 只有自己能够收到;

3: 冒泡派送: dispatchEvent(new cc.Event.EventCustom(“name”, 是否冒泡传递));

// custom_event.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的实例

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

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

}, this);

// 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) {

// },

});

recv_event.js

// recv_event.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) {

// },

});