Question 379710 in Flutter Question posted in
The official Flutter documentation can be found here.

Flutter Navigation Inside a bottom sheet

I am using the https://pub.dev/packages/modal_bottom_sheet package for my bottom sheets and it works well. But in some sheets I really need to have a navigation system using Navigator.of(context).push(...). The way I used to do it was by having a MaterialApp inside the modal to have the nested navigator. The behaviour of the navigator using this method is really perfect.

BUT

This method implicates that the modal takes always the hole screen. And for my design team thats a no no.

Do you guys have a method to either: make the modal takes the minimum space like it usually does
or a different navigation method that solves this problem (and that still uses Navigator.push()) ?

Note: the behaviour I expect is like https://pub.dev/packages/wolt_modal_sheet but this navigation system is too complicated to integrate with the big existing codebase of the app.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0 

    showMaterialModalBottomSheet(
  shape: RoundedRectangleBorder(
    borderRadius: BorderRadius.circular(20),
  ),
  context: context,
  builder: (context) => MaterialApp(
      home: SizedBox(height: 10),
    ),       
  ),
);

    For example in this snippet, the modal will not dynamically set its size to fit the container. By removing the. MaterialApp wrapper, the problem fixes itself but makes the navigation the way I want impossible


  2. 0

    What you are looking for is nested navigation.

    See here for official docs: https://docs.flutter.dev/cookbook/effects/nested-nav

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search