Vertically Dismissable Screen Implementation on Flutter

Question

What I want is simply a vertically dismissible widget. Android equivalent of what I want is Slidr and I've been searching for its equivalent in Flutter but I haven't managed to find it.

This if what I want to do;

Any idea on how I can achieve this?

Solution 1

With @Mihir Thanekar 's answer, I googled for a bit and finally found an answer which solves my problem.

Answers to this question gives you the answer of how you should show your DraggableScrollableSheet and then this package enables dismiss functionality when the sheet's size is 1.0 which is the entire screen. Native showModalBottomSheet method unfortunately is worthless at this point since there is no empty space you can use to swipe down the sheet.

Solution 2

I think this can be done with the DraggableScrollableSheet widget!

Just set the initialChildSize to 0.0 to make it hide to begin.

Then wrap this sheet widget and your TV series list view in a stack, with the sheet above the list.

When you tap a given TV series, you can change initialChildSize to 1.0, and rebuild with setState(()=>{});

Now you have a draggable sheet that shows up on tap! In order to make the navigation animation, you could use an AnimationController, or maybe there's a way to do this without a Stack in which case you could just use Navigator.pushNamed.

Thank you, and let me know if you have any further questions. For more information, check out: https://api.flutter.dev/flutter/widgets/DraggableScrollableSheet-class.html

Comments

[oividiosCaeremos]

Updating initialChildSize doesn't do anything as you can see here

[oividiosCaeremos]

Thank you for giving me a guide, even though your exact answer didn't solve the problem, DraggableScrollableSheet was the right answer for me :) Added an answer myself, for people who might run into this need in the future. Thanks again :)