HarmonyOS 多层级手势事件控制咨询

组件A和组件B是兄弟组件，两个是叠在一起的全屏大小的组件，上方的组件B有两个子组件C和D。目前想要的效果是组件D自身响应手势，组件C将手势透传到下方的组件A。

HarmonyOS

fox280

2024-12-25 13:48:01

浏览

回答 1

按赞同

按时间

put_get

可以给组件C设置属性.hitTestBehavior(HitTestMode.None)将手势透传给父组件B，再给组件B也设置属性.hitTestBehavior(HitTestMode.None)将手势透传给兄弟组件A，代码如下：

@Entry
@Component
struct Index {
  build() {
    Stack() {
      Row()
        .height('100%')
        .width('100%')
        .backgroundColor(Color.Red)
        .gesture(
          TapGesture()
            .onAction((event: GestureEvent | undefined) => {
              if (event) {
                console.log('TAG== Red')
              }
            }))
      Column() {
        Row()
          .height('40%')
          .width('90%')
          .backgroundColor(Color.Green)
          .hitTestBehavior(HitTestMode.None)
          .gesture(
            TapGesture()
              .onAction((event: GestureEvent | undefined) => {
                if (event) {
                  console.log('TAG== Green')
                }
              }))
        Row()
          .height('40%')
          .width('90%')
          .backgroundColor(Color.Blue)
          .gesture(
            TapGesture()
              .onAction((event: GestureEvent | undefined) => {
                if (event) {
                  console.log('TAG== Blue')
                }
              }))
      }
      .hitTestBehavior(HitTestMode.None)
      .gesture(
        TapGesture()
          .onAction((event: GestureEvent | undefined) => {
            if (event) {
              console.log('TAG== Row')
            }
          }))
    }
    .width('100%')
    .height('100%')
  }
}
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.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.