效果图
LongTouchPreview.gif
ps: 效果图来源于项目自带测试场景 LongTouchTestScene.fire，可以下载项目下来直接运行预览或执行快速下载命令 git clone git@github.com:zhitaocai/CocosCreatorExpandComponent.git
支持说明
- 支持点击回调（效果图前5秒演示效果）
- 支持长按回调（效果图第5秒之后演示效果）
- 支持长按期间离开节点，依旧回调长按，只有松手时才结束长按回调（效果图第8秒之后演示效果）
使用说明
- LongTouchComponent.ts 组件文件放入到自己的项目中
- 将其拖入到需要支持长按操作的节点上
- 在属性编辑器中设置长按回调事件
LongTouchSetting.png - 实现长按回调事件
/** * 处理长按逻辑 * * @param touchCounter 本次长按触摸次数 * @param customEventData 在属性检查器中传入进来的 CustomEventData */ handleToucheLogic(touchCounter: number, customEventData?: any) { this.longTouchCallBackLabel.string = `本次长按，回调了 ${touchCounter} 次`; console.log(`界面就不演示输出 CustomEventData了`); console.log(customEventData); }
参数说明
| 参数 | 说明 |
|---|---|
| Touch Interval | 触摸回调间隔（秒）。假如为0.1，那么1秒内会回调10次 Long Touch Events 事件数组 |
| Enable Multi Touching | 是否支持多点触控（当前还不支持） |
| Long Touch Events | 回调事件数组，每间隔 Touche Interval 秒回调一次 |
权重递增实现
实际开发过程中，我们可能需要实现 随着用户长按按钮时间越长，递增的数量要越来越多 ，我们暂且叫这种为 权重递增 方式。 文字描述可能比较抽象，实际效果如下：
LongTouchWithWeightPreview.gif
- 可以看到，点击1次，累计递增1次
- 长按越久，累计递增的次数会越来越快（多）
实现以上方式，只需要利用回调函数中的 长按触摸次数参数 进行处理即可，具体代码如下：
/**
* 累计计数
*/
private counter = 0;
/**
* 处理长按逻辑
*
* @param touchCounter 本次长按触摸次数
* @param customEventData 在属性检查器中传入进来的 CustomEventData
*/
handleMiddleBtnTouchLogic(touchCounter: number, customEventData?: any) {
// 这里演示效果为：
// 如果长按回调次数小于等于3次的，那么 累计次数 = 累计次数 + 1
// 如果长按回调次数大于3次的，那么 累计次数 = 累计次数 + 权重公式后的结果
if (touchCounter <= 3) {
this.counter++;
} else {
// PS: 实际使用，开发者需要根据自己的期望权重递增公司来编写，这里仅为演示
this.counter += Math.ceil((touchCounter - 3) * 1.003);
}
this.middleLongTouchCallBackLabel.string = `累计计数 ${this.counter} 次`;
}
