我的 modalBottomSheet 只能在边缘拖动

Question

我在 showModalBottomSheet 生成器中有一个 DraggableScrollableSheet。我已经为模态 sheet 设置了 isDismissible: true 但我的小部件只能在边缘拖动。那是因为我在 DraggableScrollableSheet.

里面有一个 ListView

拖到开始时列表过度滚动怎么办？

这是我的代码：

 showModalBottomSheet<void>(
      context: context,
      isScrollControlled: true,
      isDismissible: true,
      backgroundColor: Colors.transparent,
      enableDrag: true,
      builder: (BuildContext context) {
        return StackedSheet(
          backgroundColor: backgroundColor,
          onBackgroundColor: onBackgroundColor,
          padding: padding,
          minChildSize: minChildSize,
          maxChildSize: maxChildSize,
          onClose: onClose,
          child: SafeArea(
            top: false,
            child: child,
          ),
        );
      },
    );

其中 StackedSheet 是：

LayoutBuilder(
        builder: (context, constraints) {
          return DraggableScrollableSheet(
            key: Key('$_childSize'),
            initialChildSize: min(_childSize, widget.maxChildSize),
            minChildSize:
                min(_childSize - _childSize * 0.2, widget.minChildSize),
            maxChildSize: min(_childSize, widget.maxChildSize),
            expand: false,
            builder: (
              BuildContext context,
              ScrollController scrollController,
            ) {
              return ListView.separated( ...blah blah)
           }

这是一个 GIF：

我的愿望不是弹跳，而是开始被拖垮

Answer 1

在我看来，您可以使用滚动控制器在到达顶部时关闭底部页面，就像这样

if (_controller.offset <= _controller.position.minScrollExtent &&
            !_controller.position.outOfRange) {
           .....
           ..... 
         );
       }

您可以在列表视图中使用 shrinkWrap=true 阻止列表在顶部跳动。要关闭底页，您可以参考

我还没有尝试过这段代码，但希望它能以某种方式帮助你。

此外，我认为如果你保持现在的样子，在“X”右侧的顶部插入一个小“-”，用户可以触摸它向下滑动，这样会很好看。

我的 modalBottomSheet 只能在边缘拖动

My modalBottomSheet is draggable just on edges

flutter

listview

draggable

flutter-showmodalbottomsheet