鸿蒙手势交互(一:绑定手势方法)

在这里插入图片描述

一、绑定手势方法

给组件绑定不同的手势事件,并设计响应方式,当手势识别成功时,ArkUI框架将触发回调。主要有三种绑定方法:gesture()、priorityGesture() 、parallelGesture()

  1. gesture(常规手势绑定方法)

// gesture为通用的一种手势绑定方法,可以将手势绑定到对应的组件上
// 可以将点击手势TapGesture通过gesture手势将方法绑定到Text组件上
@Entry
@Component
struct Index {
  build() {
    Column() {
      Text('Gesture').fontSize(28)
        // 采用gesture手势绑定方法绑定TapGesture
        .gesture(
          TapGesture()
            .onAction(() => {
              console.info('TapGesture is onAction');
            }))
    }
    .height(200)
    .width(250)
  }
}

  1. priorityGesture(带优先级的手势绑定方法)

// 当父组件和子组件使用gesture绑定同类型的手势时,子组件优先识别通过gesture绑定的手势。
// 当父组件使用priorityGesture绑定与子组件同类型的手势时
// 父组件优先识别通过priorityGesture绑定手势
@Entry
@Component
struct Index {
  build() {
    Column() {
      Text('Gesture').fontSize(28)
        .gesture(
          TapGesture()
            .onAction(() => {
              console.info('Text TapGesture is onAction');
            }))
    }
    .height(200)
    .width(250)
    // 设置为priorityGesture时,点击文本区域会忽略Text组件的TapGesture手势事件,优先响应父组件Column的TapGesture手势事件
    .priorityGesture(
      TapGesture()
        .onAction(() => {
          console.info('Column TapGesture is onAction');
        }), GestureMask.IgnoreInternal)
  }
}

  1. parallelGesture(并行手势绑定方法)

// 父子组件相同的手势事件都可以触发
@Entry
@Component
struct Index {
  build() {
    Column() {
      Text('Gesture').fontSize(28)
        .gesture(
          TapGesture()
            .onAction(() => {
              console.info('Text TapGesture is onAction');
            }))
    }
    .height(200)
    .width(250)
    // 设置为parallelGesture时,点击文本区域会同时响应父组件Column和子组件Text的TapGesture手势事件
    .parallelGesture(
      TapGesture()
        .onAction(() => {
          console.info('Column TapGesture is onAction');
        }), GestureMask.Normal)
  }
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值