Flutter:如何使 ListView 对指针事件透明(但不是其非透明内容)?

Flutter: How to make a ListView transparent to pointer events (but not its non-transparent contents)?

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

我怎样才能通过透明控件和可滚动控件点击,从而到达可滚动控件后面的控件?

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

注意,我不能用 IgnorePointer 包裹滚动条,因为我仍然想点击滚动条中的非透明小部件。

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

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

然后在列表后面的widget中添加一个Key,用它来获取widget矩形左上角的全局位置,以及widget的大小,使用那些获取小部件的矩形:

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

如果背景小部件不移动,您可以在下一帧的 initState 内使用 WidgetsBinding.instance.addPostFrameCallback 执行此操作(如果在 [=15= 内同步执行,渲染对象将为空) ]) 并保存 Rect - 否则你将不得不在每次点击时重新计算它。

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

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