在颤动的同一页面上有2个具有相同手势的手势检测器答案

【问题标题】：Have 2 gesture detectors with same gesture on the same page in flutter在颤动的同一页面上有2个具有相同手势的手势检测器
【发布时间】：2018-06-08 16:07:26
【问题描述】：

我们正在构建一个包含 2 个容器的页面，一个是覆盖整个屏幕的大容器，另一个是大容器内的小容器。当用户触摸小容器内部并移动他们的手指时，它应该平移小容器。当他们从小容器中滑出时，它应该会移动大容器（就像 Tinder 中的卡片）。

问题是，大容器总是在小容器获得平移事件之前获得滑动事件。

有没有办法消费手势事件，这样它们就不会被发送到其他组件？

我看到了有关 GestureArena 的文档，但我没有找到任何关于它如何工作的示例。有没有办法强制一个组件总是赢得竞技场（或总是输掉它）？

编辑：为了清楚起见，重新措辞。

【问题讨论】：

标签： flutter

【解决方案1】：

非常直接的解决方案：

对于您的顶级 GestureDetector，您为回调应用条件：

// bool in a State
bool _isTopLevel = true;

// ... build code
  GestureDetector(
      onTap: _isTopLevel ? _tapEvent : null,
      child: GestureDetector(
        onTapDown: () => setState(() => _isTopLevel = false),
        onTapUp: () => setState(() => _isTopLevel = true),
        // ...
      ),
  )

一旦较低级别的GestureDetector 捕获到命中事件，顶级GestureDetector 就会被禁用。

【讨论】：

问题是，似乎大容器手势检测器在小容器获取任何事件（事件 onTapDown）之前获取了滑动事件。我尝试使用GestureDetector 的behaviour 属性，但它没有改变任何东西。
@Quentin 这有什么问题？你的意思是下一个没有得到任何事件？
它确实获得了事件，但前一个获得了它们。当我将手指放在小容器上并垂直移动时，它会按预期拖动小容器。但是当我水平移动它时，大容器将手势拦截为滑动并移动大容器（里面有小容器）。当我触摸小容器并做一个水平滑动手势时，我希望小容器移动而不是大容器。当我水平滑出小容器（在大容器中）时，我希望大容器水平移动。
所以我的解决方案应该有效。您是否尝试实施它？ @昆汀
嗨@creativecreatorormaybenot。我发现了问题所在。您的解决方案确实适用于点击手势，但我意识到问题是小容器中的 onPan 和大容器中的 onHorizontalDrag 之间的竞争。我会写一个完整的答案。感谢您的帮助，它为我指明了正确的方向:)

【解决方案2】：

问题如下： onHorizontalDrag 和 onVerticalDrag 手势将始终出现在 onPan 之前，并且将阻止 onPan 被调用（即使 GestureDetector 监听 onHorizontalDrag 事件在监听 onPan 事件之后）。在小容器（即使只是onHorizontalDragCancel）上添加任何侦听器到onHorizontalDrag 都会使小容器获取并消费事件（这意味着下面的大容器将不会收到它）。

为了解决我的问题，我将 onPanUpdate 侦听器替换为 onHorizontalDragUpdate 和 onVerticalDragUpdate（onPanStart 和 onPanEnd 也是如此）。它不如使用onPan 好，因为您只能获得用于垂直或水平事件的DragUpdateDetails（我必须添加更多逻辑来弥补这一点），但它可以防止底层GestureDetector 劫持@ 987654338@活动。

【讨论】：