鴻蒙ArkTS聲明式開(kāi)發(fā)：跨平臺(tái)支持列表PinchGesture之基礎(chǔ)手勢(shì)

PinchGesture

用于觸發(fā)捏合手勢(shì)，觸發(fā)捏合手勢(shì)的最少手指為2指，最大為5指，最小識(shí)別距離為3vp。

說(shuō)明：
開(kāi)發(fā)前請(qǐng)熟悉鴻蒙開(kāi)發(fā)指導(dǎo)文檔 ：[gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md]
從API Version 7開(kāi)始支持。后續(xù)版本如有新增內(nèi)容，則采用上角標(biāo)單獨(dú)標(biāo)記該內(nèi)容的起始版本。

接口

PinchGesture(value?: { fingers?: number, distance?: number })

參數(shù)：

參數(shù)名稱	參數(shù)類(lèi)型	必填	參數(shù)描述
fingers	number	否	觸發(fā)捏合的最少手指數(shù), 最小為2指，最大為5指。默認(rèn)值：2
distance	number	否	最小識(shí)別距離，單位為vp。默認(rèn)值：3說(shuō)明：當(dāng)識(shí)別距離的值小于等于0時(shí)，會(huì)被轉(zhuǎn)化為默認(rèn)值。

事件

名稱	功能描述
onActionStart(event:(event?: [GestureEvent]) => void)	Pinch手勢(shì)識(shí)別成功回調(diào)。
onActionUpdate(event:(event?: [GestureEvent]) => void)	Pinch手勢(shì)移動(dòng)過(guò)程中回調(diào)。
onActionEnd(event:(event?: [GestureEvent]) => void)	Pinch手勢(shì)識(shí)別成功，手指抬起后觸發(fā)回調(diào)。
onActionCancel(event: () => void)	Pinch手勢(shì)識(shí)別成功，接收到觸摸取消事件觸發(fā)回調(diào)。`HarmonyOS與OpenHarmony鴻蒙文檔籽料：mau123789是v直接拿`

示例

// xxx.ets
@Entry
@Component
struct PinchGestureExample {
  @State scaleValue: number = 1
  @State pinchValue: number = 1
  @State pinchX: number = 0
  @State pinchY: number = 0

  build() {
    Column() {
      Column() {
        Text('PinchGesture scale:n' + this.scaleValue)
        Text('PinchGesture center:n(' + this.pinchX + ',' + this.pinchY + ')')
      }
      .height(200)
      .width(300)
      .padding(20)
      .border({ width: 3 })
      .margin({ top: 100 })
      .scale({ x: this.scaleValue, y: this.scaleValue, z: 1 })
      // 三指捏合觸發(fā)該手勢(shì)事件
      .gesture(
      PinchGesture({ fingers: 3 })
        .onActionStart((event?: GestureEvent) = > {
          console.info('Pinch start')
        })
        .onActionUpdate((event?: GestureEvent) = > {
          if (event) {
            this.scaleValue = this.pinchValue * event.scale
            this.pinchX = event.pinchCenterX
            this.pinchY = event.pinchCenterY
          }
        })
        .onActionEnd(() = > {
          this.pinchValue = this.scaleValue
          console.info('Pinch end')
        })
      )
    }.width('100%')
  }
}

zh-cn_image_0000001174582848

審核編輯黃宇

聲明：本文內(nèi)容及配圖由入駐作者撰寫(xiě)或者入駐合作網(wǎng)站授權(quán)轉(zhuǎn)載。文章觀點(diǎn)僅代表作者本人，不代表電子發(fā)燒友網(wǎng)立場(chǎng)。文章及其配圖僅供工程師學(xué)習(xí)之用，如有內(nèi)容侵權(quán)或者其他違規(guī)問(wèn)題，請(qǐng)聯(lián)系本站處理。舉報(bào)投訴