Flutter：如何使 ListView 对指针事件透明（但不是其非透明内容）？

Question

我有一个Scrollable（ListView或任何其他），它包含一个透明的小部件，比如Container(height:200). 我可以看到小部件和可滚动的（换句话说，我可以看到可滚动后面的小部件）。

我怎样才能点击透明小部件和可滚动部件，以便到达可滚动部件后面的小部件？

ListView(
  children: [
    Container(height: 200), // Transparent.
    Container(color: Colors.red, height: 200),
    ],
);

请注意，我不能用 包裹可滚动IgnorePointer，因为我仍然想单击可滚动中的非透明小部件。

Answer 1

我能想到的唯一合理的解决方案是在透明容器上有一个GestureDetector，这将为您提供水龙头的全局位置：

GestureDetector(
  onTapUp: (TapUpDetails tapUpDetails) {
    print("onTapUp global: " + tapUpDetails.globalPosition.toString());
  },

然后Key向列表后面的小部件添加 a ，并使用它来获取小部件矩形左上角的全局位置以及小部件的大小，并使用这些来获取小部件的矩形：

RenderBox renderBox = _key.currentContext.findRenderObject();
Offset topLeftCorner = renderBox.localToGlobal(Offset.zero);
Size size = renderBox.size;
Rect rectangle = topLeftCorner & size;

如果背景小部件不移动，您可以initState在下一帧内使用WidgetsBinding.instance.addPostFrameCallback（如果在 内同步执行，则渲染对象将为空initState）并保存Rect- 否则您将不得不在每次点击时重新计算它。

最后，在透明容器上的每次点击时，您可以计算点击的位置是否在背景小部件的边界内，并调用相应的代码：

// if tap is within boundaries of the background widget
if (rectangle.contains(tapUpDetails.globalPosition)) {
  // your code here
}