CocosCreator TOUCH_MOVE事件

  • 注册事件
  • 在onDestroy里注销本事件
onLoad() {
	this.node.on(cc.Node.EventType.TOUCH_MOVE, this._touchMove, this);
}

protected onDestroy(): void {
	this.node.off(cc.Node.EventType.TOUCH_MOVE, this._touchMove, this);
}
  • 绑定的事件,里面可以获取到的一些参数
private _touchMove(e) {
	console.log(e.getPreviousLocation());
}
  • 重点在这里:执行结果,可见右侧console里有非常多的执行结果,而这只是移动一小段所触发的。
    CocosCreator TOUCH_MOVE事件

  • touch move会在触摸移动时不断执行,每移动一点点都会执行一次。

  • 可以利用每次移动得到的各种信息(如位置信息等)来进行一些判断和操作。

  • 换一种尝试:

private _touchMove(e) {
    console.log(e.getDelta().x, e.getDelta().y);
}
  • 运行结果:
    CocosCreator TOUCH_MOVE事件

官方文档及API

触摸事件类型和事件对象

触摸事件在移动平台和桌面平台都会触发,这样做的目的是为了更好得服务开发者在桌面平台调试,只需要监听触摸事件即可同时响应移动平台的触摸事件和桌面端的鼠标事件。系统提供的触摸事件类型如下:

枚举对象定义 对应的事件名 事件触发的时机
cc.Node.EventType.TOUCH_START touchstart 当手指触点落在目标节点区域内时
cc.Node.EventType.TOUCH_MOVE touchmove 当手指在屏幕上移动时
cc.Node.EventType.TOUCH_END touchend 当手指在目标节点区域内离开屏幕时
cc.Node.EventType.TOUCH_CANCEL touchcancel 当手指在目标节点区域外离开屏幕时

触摸事件(cc.Event.EventTouch)的重要 API 如下(cc.Event 标准事件 API 除外):

API 名 类型 意义
touch cc.Touch 与当前事件关联的触点对象
getID Number 获取触点的 ID,用于多点触摸的逻辑判断
getLocation Object 获取触点位置对象,对象包含 x 和 y 属性
getLocationX Number 获取触点的 X 轴位置
getLocationY Number 获取触点的 Y 轴位置
getPreviousLocation Object 获取触点上一次触发事件时的位置对象,对象包含 x 和 y 属性
getStartLocation Object 获取触点初始时的位置对象,对象包含 x 和 y 属性
getDelta Object 获取触点距离上一次事件移动的距离对象,对象包含 x 和 y 属性

需要注意的是,触摸事件支持多点触摸,每个触点都会发送一次事件给事件监听器。

上一篇:第11天 下拉刷新


下一篇:JavaScript中 Touch 事件详解