如何实现Stack布局页面内点击事件透传

Stack布局叠加之后,透明页面如何将手势透传给下层视图,使下层兄弟组件也能响应事件。

HarmonyOS
2024-07-22 11:59:45
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
superinsect

可以通过给组件设置触摸测试控制hitTestBehavior属性,根据设置不同的属性枚举值,达到不同的事件透传效果,具体可参考文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-references/ts-universal-attributes-hit-test-behavior-0000001815767744#ZH-CN_TOPIC_0000001815767744__hittestmode%E6%9E%9A%E4%B8%BE%E8%AF%B4%E6%98%8E

参考代码:

@Entry 
@Component 
struct PageHitTestBehavior { 
  @State message: string = 'Hello World'; 
 
  build() { 
    Stack() { 
      Column() { 
        Text('下层column') 
      } 
      .onTouch(() => { 
        console.log('下层onTouch') 
      }) 
      .width('50%') 
      .height('50%') 
      .backgroundColor(Color.Blue) 
 
      Column() { 
        Text('上层column') 
      } 
      .onTouch(() => { 
        console.log('上层onTouch') 
      }) 
      //设置HitTestMode.Transparent,自身和子节点都响应触摸测试,不会阻塞兄弟节点的触摸测试。 
      .hitTestBehavior(HitTestMode.Transparent) 
      .width('50%') 
      .height('50%') 
    } 
    .width('100%') 
    .height('100%') 
  } 
}
分享
微博
QQ
微信
回复
2024-07-22 19:46:52
相关问题
如何实现事件,你会吗?
1853浏览 • 1回复 待解决
怎么onClick事件
127浏览 • 1回复 待解决
两个重叠的组件如何实现事件
332浏览 • 1回复 待解决
customDialog焦点
690浏览 • 1回复 待解决
如何点击事件传到下一层
1715浏览 • 1回复 待解决
Stack实现叠层布局的方式
287浏览 • 1回复 待解决
父组件中如何处理子组件点击事件
2548浏览 • 1回复 待解决
HarmonyOS 如何实现页面反向值?
187浏览 • 1回复 待解决
RelativeContainer布局嵌套Stack失效
256浏览 • 1回复 待解决
基于tabs实现页面布局
591浏览 • 1回复 待解决
点击事件,@State 页面未生效,在线等
2621浏览 • 0回复 待解决
Stack组件中如何触发下层事件的控件
120浏览 • 1回复 待解决