如何在长按手势回调方法里获取手指触摸点的坐标?

Question

如何在长按手势回调方法里获取手指触摸点的坐标

Answer 1

使用组合手势的顺序识别，当长按手势事件结束后触发拖动手势事件。在手势回调方法里获取event（GestureEvent类型）的fingerList（FingerInfo类型），获取到localX和localY数值，表示相对于当前组件元素原始区域左上角的坐标地址。可参考如下代码：

import { promptAction } from '@kit.ArkUI'; 
 
@Entry 
@Component 
struct CombinedExample { 
  @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") 
  } 
}