当前位置:   article > 正文

鸿蒙开发之Tap手势_鸿蒙java手势

鸿蒙java手势

首先,组件上如果同时有tap和click两种事件,那么组件会响应click事件

一、API的使用

给组件添加tap点击事件,直接调用gesture属性方法即可,里边传入一个TapGesture对象

  1. Text(this.message)
  2. .fontSize(50)
  3. .fontWeight(FontWeight.Bold)
  4. .gesture(
  5. TapGesture()
  6. .onAction(() => {
  7. console.log(' gesture test onAction text')
  8. }))

二、Tap事件的优先级

父组件绑定了tap事件,子组件也绑定了tap事件时,响应子组件的tap事件

三、Tap事件拦截priorityGesture

当我们需要在父组件中拦截子组件的tap事件时就需要用到priorityGesture属性方法,官方文档中解释里边需要两个参数,一个是手势事件,一个是是否屏蔽子组件的手势。

  1. Column() {
  2. Text(this.message)
  3. .fontSize(50)
  4. .fontWeight(FontWeight.Bold)
  5. .gesture(TapGesture().onAction(() => {
  6. console.log(' gesture test onAction text')
  7. }))
  8. }
  9. .priorityGesture(
  10. TapGesture()
  11. .onAction(() => {
  12. console.log(' gesture test tap Column')
  13. }),
  14. //设置是否屏蔽子组件的tap事件
  15. GestureMask.Normal
  16. )

其中第二个参数,我在测试的过程中发现并不是如下官网解释

注意⚠️:实际测试中,当我设置了Normal,子组件(Text)依然无法响应tap事件,也就是无论我设置Normal还是IgnoreInternal,tap事件只响应父组件(Column)的事件。

四、同时响应父子组件的tap事件

如上,我通过设置GestureMask.Normal无法达到父子组件的tap事件同时响应。但是,如果我需要两者都响应tap事件,那么我可以借助parallelGesture属性方法

  1. Column() {
  2. Text(this.message)
  3. .fontSize(50)
  4. .fontWeight(FontWeight.Bold)
  5. .gesture(TapGesture().onAction(() => {
  6. console.log(' gesture test onAction text')
  7. }))
  8. }
  9. .parallelGesture(
  10. TapGesture()
  11. .onAction(() => {
  12. console.log(' gesture test tap parallelGesture')
  13. })
  14. )

设置了Text文本的tap手势,并且设置了Column的parallelGesture属性方法。这样Text和Column的Tap事件都可以响应了。

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/2023面试高手/article/detail/300388
推荐阅读
相关标签
  

闽ICP备14008679号