鸿蒙开发之组合手势

当我们需要支持多个手势的时候,可以通过GestureGroup来实现,如下实现了同时支持Tap和Pan手势

import Prompt from '@system.prompt'
@Entry
@Component
struct OfficialGestureGroupPage {
  @State message: string = 'Hello World'

  build() {
      Column() {
        Column() {
          Text(this.message)
            .fontSize(50)
            .fontWeight(FontWeight.Bold)
            .border({width:3})
            .backgroundColor(Color.Brown)

        }
        .width(300)
        .height(200)
        .margin(50)
        .padding(20)
        .gesture(
                    //并发的触发所有手势
          GestureGroup(GestureMode.Parallel,
            //添加拖拽手势
            PanGesture()
              .onActionStart(() => {
                Prompt.showToast({message:'gesture pan start'})
              })
              .onActionUpdate((event:GestureEvent) => {
                Prompt.showToast({message:'gesture pan update'})
              })
              .onActionEnd(() => {
                Prompt.showToast({message:'gesture pan end'})
              }),
            //添加点击手势
            TapGesture()
              .onAction(() => {
                Prompt.showToast({message:'gesture tap'})
              })
            )
        )
      }
      .width('100%')
      .height('100%')
  }
}

其中,GestureGroup的mode参数含义如下

鸿蒙开发之组合手势_第1张图片

你可能感兴趣的:(鸿蒙开发,鸿蒙)