组件遮挡导致Stack组件中有Span组件时,单击事件无法透过Span组件向下传递

代码如下:

@Entry 
@Component 
export struct Demo { 
  build() { 
    Column() { 
      Stack() { 
        Button('组件一') 
          .width(100) 
          .height(100) 
          .backgroundColor(Color.Red) 
          .priorityGesture(TapGesture({ count: 1 }) 
            .onAction((event?: GestureEvent) => { 
              // 开始单击 
              console.info('事件demo    组件一点击') 
            })) 
        Text(){ 
          Span('组件二') 
            .hitTestBehavior(HitTestMode.None) 
            .fontColor(Color.Orange) 
        } 
        .width(200) 
        .height(200) 
        .backgroundColor(Color.White) 
        .hitTestBehavior(HitTestMode.None) 
      } 
    } 
  } 
}
HarmonyOS
2024-04-29 00:22:51
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
l634youngpig

因为Button('组件一')被Text()遮盖,导致点击效果不成功。

本地使用下方代码测试单击事件可以向下传递,日志有稳定输出,因为 Button(‘组件一’)被Text()遮盖了,需要注意点击的位置,测试时可以把Text设置透明度以看到底部的button组件方便点击。

代码如下:

@Entry 
@Component 
export struct Demo { 
  build() { 
    Column() { 
      Stack() { 
        Button('组件一') 
          .width(100) 
          .height(100) 
          .backgroundColor(Color.Red) 
          .priorityGesture(TapGesture({ count: 1 }) 
            .onAction((event?: GestureEvent) => { 
              // 开始单击 
              console.info('事件demo 组件一点击') 
            })) 
        Text() { 
          Span('组件二') 
            .hitTestBehavior(HitTestMode.None) 
            .fontColor(Color.Orange) 
        } 
        .width(200) 
        .height(200) 
        .backgroundColor(Color.White) 
        .hitTestBehavior(HitTestMode.None) 
        .opacity(0.2) 
      } 
    } 
  } 
}
分享
微博
QQ
微信
回复
2024-04-29 16:21:37
相关问题
span组件使用margin属性失效
71浏览 • 1回复 待解决
组件事件能否到传递组件
413浏览 • 1回复 待解决
Image组件无法设置长按事件
87浏览 • 1回复 待解决
组件中如何处理子组件内点击事件
476浏览 • 1回复 待解决
js 自定义组件如何传递方法?
4249浏览 • 2回复 待解决
创建多个视频组件无法播放
433浏览 • 1回复 待解决
弹窗组件无法进入onPageShow方法
212浏览 • 1回复 待解决
组件有没有支持事件穿透的属性
88浏览 • 1回复 待解决
Web组件的onKeyEvent键盘事件不生效
353浏览 • 1回复 待解决
自定义组件嵌套子组件
7375浏览 • 3回复 待解决
如何选择Navigation 组件与 Tabs 组件
324浏览 • 1回复 待解决