DraggableScrollableSheet closes when swiping up

Question

I have noticed if maxChildSize and minChildSize has the same value then swiping up on the contents of DraggableScrollableSheet closes the bottom sheet.

The expected behaviour is to scroll down the ListView provided in the builder argument of the DraggableScrollableSheet.

I believe the expected behaviour should be followed even when both maxChildSize and minChildSize are the same.

Am I missing something?

Here is the minimum reproducible code:

import 'package:flutter/material.dart';

class DraggableBottomSheetTest extends StatelessWidget {
  const DraggableBottomSheetTest({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            showModalBottomSheet(
              context: context,
              isScrollControlled: true,
              builder: (context) {
                return DraggableScrollableSheet(
                  maxChildSize: 0.5,
                  minChildSize: 0.5,
                  initialChildSize: 0.5,
                  expand: false,
                  builder: (context, controller) => ListView.builder(
                    controller: controller,
                    itemCount: 50,
                    itemBuilder: (context, index) => ListTile(
                      title: Text('Item $index'),
                    ),
                  ),
                );
              },
            );
          },
          child: Text('Show Modal BottomSheet'),
        ),
      ),
    );
  }
}

score 0 · Answer 1 · answered Oct 05 '22 at 11:35

import 'package:flutter/material.dart';

class DraggableBottomSheetTest extends StatelessWidget {
  const DraggableBottomSheetTest({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            showModalBottomSheet(
              context: context,
              isScrollControlled: true, // set this to true
              builder: (context) {
                return DraggableScrollableSheet(
                  maxChildSize: 0.5,
                  minChildSize: 0.5,
                  initialChildSize: 0.5,
                  expand: false,
                  builder: (context, controller) => ListView.builder(
                    controller: controller,
                    itemCount: 50,
                    itemBuilder: (context, index) => ListTile(
                      title: Text('Item $index'),
                    ),
                  ),
                );
              },
            );
          },
          child: Text('Show Modal BottomSheet'),
        ),
      ),
    );
  }
}

Did adding `isScrollControlled: true` work for you? I just tested it (and updated my question) and it gives the same behaviour as before! — Slick Slime, Oct 06 '22 at 06:26

DraggableScrollableSheet closes when swiping up

1 Answers1