0

I want to use a modal bottom sheet in the flutter. but I can't drag it.

 showModalBottomSheet(
    context: context,
    isScrollControlled: true,
    isDismissible: true,
    enableDrag: true,
    shape: RoundedRectangleBorder(
    borderRadius: BorderRadius.vertical(top: 
    Radius.circular(20),), ),
    clipBehavior: Clip.antiAliasWithSaveLayer,
     builder: (context) {
        return StreamBuilder(
        stream: controller.stream,
        builder: (context, snapshot) =>
GestureDetector( behavior: HitTestBehavior.translucent,
 child: Container(
  height: snapshot.hasData
     ? snapshot.data as double
     : pageWidth * .9,
     child: PlayerCardDialog(
 epdId: episodes[index['Ep_ID'])), ),); });

can anyone help me please? how can I drag the bottom sheet and how can I set snapping for it in four positions ([0.3, 0.6, 0.9, 1.0]).

like this :

enter image description here

1 Answers1

0

you can user DraggableScrollableSheet. use the snap and snapSizes for snapping.

However, I think snapping is added in the master channel of Flutter so if you can't find it you may need to switch to master.

Or you can check the snapping_sheet package.

Edit: Example with showModalBottomsheet()

void showBottomSheet(context) {
  showModalBottomSheet(
    context: context,
    builder: (context) {
      return DraggableScrollableSheet(
        snap: true
        // snapSizes: TODO
        expand: false,
        builder: (context, scrollController) {
          return StreamBuilder(
            stream: Stream.empty(),
            builder: (context, snapshot) => GestureDetector(
              behavior: HitTestBehavior.translucent,
              child: Container(
                height: snapshot.hasData ? snapshot.data as double : 500 * .9,
                child: Text('Test'),
              ),
            ),
          );
        },
      );
    },
  );
}
Elfor
  • 547
  • 5
  • 10
  • cant do it with showModalBottomsheet ? becuse I need `height: snapshot.hasData ? snapshot.data as double : pageWidth * .9` this part for dynamic height. –  Oct 24 '21 at 15:57
  • @stysh it's a widget and `showModalBottomsheet()` needs a widget, so yes you can. Just return the `GestureDetector` in its builder. – Elfor Oct 24 '21 at 16:56
  • actually, I've used it. would you please help me? I don't understand your idea. –  Oct 24 '21 at 17:19
  • it's not work :( and `snap: true // snapSizes: TODO` has error –  Oct 24 '21 at 19:47