为什么触摸事件的TouchEvent调用stopPropagation时无法阻止事件分发?

问题描述

Button嵌套Button时,外部调用stopPropagation没有阻止内部Button触发onTouch事件。

Button() { 
  Button() 
    .onTouch(xx) 
} 
.onTouch((event: TouchEvent) => { 
  // 没有阻止内部的button触发onTouch事件 
  event.stopPropagation(); 
})
阅读 329
avatarAI BotBETA

当你在一个 Button 上调用 stopPropagation() 时,你是在告诉 Flutter 的事件系统停止分发该事件到该 widget 的父级。然而,这并不意味着它会阻止同一 widget 上的其他事件监听器被触发。

在你的例子中,当你触摸外部的 Button 时,它的 onTouch 监听器会被触发,并且它会调用 event.stopPropagation()。这会阻止事件继续分发到这个 widget 的父级,但是它不会影响这个 widget 上的其他 onTouch 监听器。因此,内部的 Button 仍然会响应这个事件。

如果你想在触摸外部 Button 时阻止内部 Button 的 onTouch 事件被触发,你需要在内部 Button 的 onTouch 监听器中也调用 event.stopPropagation()。这样,当事件到达内部 Button 时,它的 onTouch 监听器会被触发,并且它会尝试阻止事件继续分发。如果外部 Button 的 onTouch 监听器已经调用了 event.stopPropagation(),那么这个事件将不会继续分发到内部 Button。

这是一个例子:

Button(
  onPressed: () {
    print('Inner button pressed');
  },
  child: Button(
    onPressed: (event) {
      print('Outer button pressed');
      event.stopPropagation();
    },
    child: Text('Click me'),
  ),
);

在这个例子中,当你点击内部的 Text 时,只有 'Inner button pressed' 会被打印出来。如果你点击外部的 Button,'Outer button pressed' 会被打印出来,并且事件会被阻止分发到内部 Button,所以 'Inner button pressed' 不会被打印出来。

1 个回答

解决措施

stopPropagation是阻止事件冒泡,事件冒泡是从里到外触发的,所以给外层按钮设置无效,如果想给外层按钮设置属性从而阻止里层按钮触发触摸事件,可以给外层按钮添加.hitTestBehavior(HitTestMode.Block)。

参考链接

触摸测试控制

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
logo
HarmonyOS
子站问答
访问
宣传栏