两个重叠的组件如何实现事件透传

两个重叠的组件如何实现事件透传

HarmonyOS
2024-07-24 10:56:26
1125浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
一杯生椰

在特定场景中,当存在两个兄弟组件时,即组件A与组件B,若组件B在布局上覆盖了组件A,且用户执行点击操作于组件B之上,此时使得点击事件能够穿透组件B,直接传递给组件A,从而触发组件A的onClick回调,同时避免触发组件B的onClick回调。

组件B设置hitTestBehavior属性为HitTestMode.None即可。参考代码如下:

@Entry
@Component
struct StackExample {
  build() {
    Stack({ alignContent: Alignment.Bottom }) {
      Text('A')
        .width('90%')
        .height('100%')
        .backgroundColor(0xd2cab3)
        .align(Alignment.Top)
        .onClick(() => {
          console.log('11111')
        })
      Text('B')
        .width('70%')
        .height('60%')
        .backgroundColor(0xc1cbac)
        .align(Alignment.Top)
        .hitTestBehavior(HitTestMode.None)
        .onClick(() => {
          console.log('1111122222')
        })
    }.width('100%').height(150).margin({ top: 5 })
  }
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
分享
微博
QQ
微信
回复
2024-07-24 19:54:13


相关问题
如何实现事件,你会吗?
3312浏览 • 1回复 待解决
怎么onClick事件
878浏览 • 1回复 待解决
HarmonyOS 两个同级组件问题
1245浏览 • 1回复 待解决
关于Image组件两个问题
1201浏览 • 1回复 待解决
HarmonyOS 弹层点击事件处理
888浏览 • 1回复 待解决
customDialog焦点
1457浏览 • 1回复 待解决
页面导航如何实现两个页面叠层
2457浏览 • 1回复 待解决
HarmonyOS 如何合并两个对象
935浏览 • 1回复 待解决
页面导航如何实现A B两个页面叠层
1066浏览 • 1回复 待解决
HarmonyOS 如何比较两个日期大小?
1455浏览 • 1回复 待解决
HarmonyOS 半模态转场,如何手势?
1227浏览 • 1回复 待解决
HarmonyOS NFC
835浏览 • 1回复 待解决
HarmonyOS 两个网页间数据如何同步
606浏览 • 1回复 待解决