Flutter中HitTestBehavior.translucent表现异常且结果不一致?
Flutter中HitTestBehavior.translucent点击行为不一致问题
我原本以为HitTestBehavior.translucent的行为逻辑是:当Stack中子组件A在B的视觉层级后方时,点击A和B的重叠区域,会同时触发两个组件的点击回调。但经过代码测试后发现实际表现并非如此,甚至存在不一致的情况,完全不符合预期。
我的预期逻辑:
- 当B的behavior设置为
translucent时,点击B应同时将点击事件传递给后方的A,触发A的点击回调 - 当B的behavior设置为
opaque时,点击B仅触发自身的点击回调 - 当B的behavior设置为
deferToChild时,点击B的处理逻辑由其子组件决定
但从测试日志可以看到,即使明确将behavior设置为translucent,在同一位置快速多次点击时,有时点击事件会传递到后方的组件,有时则不会,表现出明显的不一致性。
复现代码
@override Widget build(BuildContext context) { return Scaffold( body: GestureDetector( onTapDown: (_) { print('outer gd tapped'); }, child: Container( color: Colors.red, width: 500, height: 500, alignment: Alignment.center, child: GestureDetector( behavior: HitTestBehavior.translucent, onTapDown: (_) { print('inner gd tapped'); }, child: Container( color: Colors.cyanAccent, width: 200, height: 200, ), ), ), ), ); }
应用界面
界面包含一个500×500的红色容器,其中心位置嵌套了一个200×200的青色容器。
测试日志
快速多次点击青色容器后,日志输出如下(可见部分点击触发了后方红色容器的回调,而点击位置始终未变):
flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: inner gd tapped flutter: outer gd tapped <---------- 此处异常 flutter: inner gd tapped flutter: outer gd tapped <---------- 此处异常 flutter: inner gd tapped flutter: outer gd tapped <---------- 此处异常 flutter: inner gd tapped flutter: outer gd tapped <---------- 此处异常 flutter: inner gd tapped
内容的提问来源于stack exchange,提问作者Haidar
相关产品推荐
相关产品推荐

