向下滚动内部可滚动时关闭底部工作表

Question

我有 Flutter 的全屏模态底表，里面有SingleChildScrollView。

正常的结果是，无论我向上还是向下滚动，它都会滚动内部可滚动。我可以通过向下拖动可滚动范围之外的任何内容来关闭模态底部工作表(对我来说，它是一个带有拖动手柄的小容器(。

问题是，如果我向下拉内部可滚动，我想下拉底板。经过一些研究，我发现我应该用AlwaysScrollableScrollPhysics和NeverScrollableScrollPhysics进行操作，但我真的找不到最好的解决方案。

我的想法是允许内部可滚动，直到它的滚动偏移为负。这不起作用，因为我需要某种方法才能在不关闭底表的情况下停止滚动时使其可滚动。

我可以将内部可滚动包装成GestureDetector并检查滚动增量，但还没有成功。

也许有人遇到过类似的问题并得到了一些示例或算法？

Answer 1

添加modal_bottom_sheet并使用showMaterialModalBottomSheet

showMaterialModalBottomSheet(
context: context,
builder: (context) {
return SingleChildScrollView(
child: Column(
children: [
Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height * 0.8,
color: Colors.green,
),
Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height * 0.8,
color: Colors.red,
),
],
),
);
});

Answer 2

你可以使用modal_bottom_sheet包，这也是Miftakhul Arzak在这里建议的。

modal_bottom_sheet支持开箱即用的所需行为，我引用自述文件：

支持内部滚动视图+向下拖动以关闭(showModalBottomSheet无法在滚动视图中正常工作。

但请注意：如果您没有正确使用包，则对于超过屏幕大小的长列表，您可能仍然会遇到问题。

这是您确保将滚动视图的顶部滚动到底部将关闭模式的方法：

import 'package:modal_bottom_sheet/modal_bottom_sheet.dart';
...
showMaterialModalBottomSheet(
context: context,
builder: (context) => SingleChildScrollView(
controller: ModalScrollController.of(context),
child: Container(),
),
);

您基本上要求内部滚动视图由模态的逻辑控制

，并带有controller: ModalScrollController.of(context)

。如果您不想使用此软件包，则其他答案可能会使用默认的Flutter showModalBottomSheet解决您的问题：使用SingleChildScrollView时无法向下拖动botttom sheet。