如何在长按手势回调方法里获取手指触摸点的坐标
2024-12-18 15:42:07
121次阅读
0个评论
使用组合手势的顺序识别,当长按手势事件结束后触发拖动手势事件。在手势回调方法里获取event(GestureEvent类型)的fingerList(FingerInfo[]类型),获取到localX和localY数值,表示相对于当前组件元素原始区域左上角的坐标地址。可参考如下代码
import { promptAction } from '@kit.ArkUI';
@Component
struct CoordinatesOfTheFingerTouchPoint {
@State count: number = 0;
private touchAreaRight: number = 0;
private touchAreaBottom: number = 0;
@State positionX: number = 0;
@State positionY: number = 0;
@State gestureEventInfo: string = '';
build() {
Column() {
Row() {
Column() {
Text('+')
.fontSize(28)
.position({ x: this.positionX, y: this.positionY })
}
.height(200)
.width('100%')
.backgroundColor('#F1F3F5')
.onAreaChange((oldValue: Area, newValue: Area) => {
this.touchAreaRight = newValue.width as number;
this.touchAreaBottom = newValue.height as number;
})
.gesture(
// 以下组合手势为顺序识别,当长按手势事件未正常触发时则不会触发拖动手势事件
GestureGroup(GestureMode.Sequence,
LongPressGesture({ repeat: true })
.onAction((event: GestureEvent) => {
if (event.repeat) {
this.count++;
}
}),
PanGesture()
.onActionStart(() => {
promptAction.showToast({ message: 'Pan start', duration: 1000 });
})
.onActionUpdate((event: GestureEvent) => {
for (let i = 0; i < event.fingerList.length; i++) {
if (event.fingerList[i] == undefined
|| event.fingerList[i].localX < 0
|| event.fingerList[i].localY < 0
|| event.fingerList[i].localX > this.touchAreaRight
|| event.fingerList[i].localY > this.touchAreaBottom) {
return;
}
this.positionX = event.fingerList[i].localX;
this.positionY = event.fingerList[i].localY;
}
this.gestureEventInfo = 'sequence gesture\n' + 'LongPress onAction' + this.count
+ '\nX:' + this.positionX + '\nY:' + this.positionY;
})
.onActionEnd(() => {
promptAction.showToast({ message: 'Pan end', duration: 1000 });
})
)
.onCancel(() => {
promptAction.showToast({ message: '取消', duration: 1000 });
})
)
}
.padding(12)
.borderRadius(24)
.backgroundColor(Color.White)
Text(this.gestureEventInfo)
.fontSize(18)
.width('100%')
.textAlign(TextAlign.Start)
.padding({ left: 18, top: 30 })
}
.height('100%')
.width('100%')
.backgroundColor('#F1F3F5')
}
}
00
- 1回答
- 0粉丝
- 0关注
相关话题
- 如何在Page中获取WindowStage实例
- OpenHarmony: 如何获取当前HAP的BundleName
- 如何获取状态管理框架代理前的原始对象
- 如何调用系统拍照并获取图片
- 如何获取设备屏幕横竖屏状态
- 为用户提供直观的坐标显示
- TextInput组件获取焦点的几种场景
- 如何添加联系人到手机通讯录
- 实战技巧 DevEco Profiler 性能调优 Time
- 实战技巧 DevEco Profiler 性能调优 Time
- 获取链接文件信息
- OpenHarmony 如何优雅的编写注释
- HCIA-openEuler 技术覆盖范围、学习方法及其在工作中的实际作用
- 用户信息管理小 Demo 解析与相关知识点介绍
- HarmonyOS Next 如何优雅的编写注释