语法
触摸事件类型
类型 | 语法 | 作用 |
---|---|---|
START | TOUCH_START | 触摸开始 |
MOVE | TOUCH_MOVE | 触摸移动 |
ENDED | TOUCH_ENDED | 触摸结束(在作用域内抬起) |
CANCEL | TOUCH_CANCEL | 触摸结束(在作用域外抬起) |
监听触摸事件
on
在节点上注册指定类型的回调函数,也可以设置 target 用于绑定响应函数的 this 对象。
语法
this.node.on(Type,callback,target);
实例
this.node.on(cc.node.EventType.TOUCH_START,this.on_touch_start,this);
解析
- Node.EventType.Type 表示要监听的事件类型
- callback 事件发生时要执行的回调函数(要做什么)
- target 用于绑定响应函数的 this 对象。
关闭触摸事件
单独关闭
off
删除之前与同类型,回调,目标或 useCapture 注册的回调。
语法
this.node.off(cc.Node.EventType.Type,callback,target);
实例
this.node.off(cc.Node.EventType.TOUCH_START,on_touch_start,this);
解析
关闭事件类型为TOUCH_START,回调函数为on_touch_start,target为this的回调
如果你要关闭某个事件那么三个属性都要一样才行
整体关闭
targetOff
移除目标上的所有注册事件。
语法
node.targetOff(target);
实例
this.Node.targetOff(this);
回调函数参数设置
function(t) t => (cc.Touch)
callback处的回调函数有个参数t
参数方法
方法 | 作用 |
---|---|
getLocation | 获取当前触摸点的位置 |
getLocationX | 获取当前触摸点的x坐标(同理还有个Y) |
getPreviousLocation | 获取上一次触摸点的位置,对象包含 x 和 y 属性 |
getStartLocation | 获取第一次落下的位置,对象包含 x 和 y 属性 |
getDelta | 获取距离上一次事件的移动距离,对象包含 x 和 y 属性 |
getID | 触点的标识 ID,可以用来在多点触摸中跟踪触点。 |
setTouchInfo | 设置触摸相关的信息。用于监控触摸事件。参数id,x,y |
还有获取在游戏窗口的位置坐标,在窗口位置的坐标方法在以上方法上加InView,例getStartLocationInView
实例
on_touch_start(t){
//输出当前触摸点的位置
console.log(t.getLocation());
}
实战
这里做了一个简单的按住移动效果,来展示上面的各种方法使用。其他方法可以照葫芦画瓢。
cc.Class({
extends: cc.Component,
properties: {
},
onLoad () {
//监听触摸开始事件
this.node.on(cc.Node.EventType.TOUCH_START,function(t){
//函数体内写事件发生时的事情
//当触摸开始是打印以下字样
console.log("触摸开始");
},this);
//监听触摸移动事件
//使用自定义回调函数
this.node.on(cc.Node.EventType.TOUCH_MOVE,this.on_touch_move,this);
//结束触摸移动事件
//this.node.off(cc.Node.EventType.TOUCH_MOVE,this.on_touch_move,this);
//监听作用域内触摸抬起事件
this.node.on(cc.Node.EventType.TOUCH_ENDED,function(t){
console.log("触摸内结束");
},this);
//监听作用域外触摸抬起事件
this.node.on(cc.Node.EventType.TOUCH_CANCEL,function(t){
console.log("触摸外开始");
},this);
},
//自定义回调函数,参数t
on_touch_move(t){
//定义一个n_pos变量存储当前触摸点的位置
var n_pos = t.getLocation();
//打印触摸点的坐标,x坐标,y坐标
console.log(n_pos,n_pos.x,n_pos.y);
//定义变量delta存储变化距离
var delta = t.getDelta();
//变化当前节点位置使其跟随触摸点,实现按住移动效果
this.node.x += delta.x;
this.node.y += delta.y;
},
//start () {},
// update (dt) {},
});