2

I'm trying to create a draggable bottom sheet that will have a set header & footer. Between those, the body/content will vary. There may be an empty state or there may be a list of data. The user should be able to expand this sheet to the top of the screen as well.

Here is a base example where I can see all the data, but I can't get it to drag up to the max size. I can only scroll within that ListView between the header & footer.

How can I update this so I can still drag the sheet to snap to the top, or back to the middle, or dismiss?

Code Example:

void _showDraggableSheet(context) {
    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      useRootNavigator: true,
      builder: (_) {
        return DraggableScrollableSheet(
          expand: false,
          initialChildSize: 0.65,
          minChildSize: 0.65,
          maxChildSize: 0.9,
          builder: (_, controller) {
            return Container(
              color: Colors.black,
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.stretch,
                mainAxisSize: MainAxisSize.min,
                children: <Widget>[
                  _buildHeader(),
                  _buildContent(),
                  _buildFooter(),
                ],
              ),
            );
          },
        );
      },
    );
  }


  Widget _buildContent() {
    return Expanded(
      child: Container(
        color: Colors.green,
        child: ListView.builder(
          itemCount: 100,
          itemBuilder: (_, i) => ListTile(title: Text('Item $i')),
        ),
      ),
    );
  }
Luke Irvin
  • 1,179
  • 1
  • 20
  • 39

1 Answers1

0

I've asked the question in the Flutter repository, but didn't notice the reply.
If you're still working on your project, you could've checked out the answer I've got from Flutter team.
It should work as expected now.

pseusys
  • 407
  • 2
  • 5
  • 17
  • A link to a solution is welcome, but please ensure your answer is [useful without it](//meta.stackexchange.com/a/8259): add context around the link so others will have some idea what it is and why it’s there, then quote the most relevant part in case the linked page is unavailable. – ray Mar 13 '23 at 01:45
  • That's not the case, the answer here is not a solution - it's just an announcement that I received a message from developers team that the issue was fixed. – pseusys Mar 13 '23 at 02:21