Show a SnackBar Above Modal Bottom Sheet

Question

I tried to display a SnackBar above my Modal Bottom Sheet, but it doesn't work. Any idea how to achieve that?

P.S.: Setting the SnackBar Behavior to Floating doesnt work. It still appears below the modal bottom sheet

Thank you

Answer 1

You will need to use GlobalKey<ScaffoldState> to show the Snackbar in desired Scaffold, for that you can added Scaffold in your showModalBottomSheet like below snip;

Define you GlobalKey in your Statefull or Stateless widget class

final GlobalKey<ScaffoldState> _modelScaffoldKey = GlobalKey<ScaffoldState>();

And on button press you can have;

                showModalBottomSheet(
                  context: context,
                  builder: (_) => Scaffold(
                      extendBody: false,
                      key: _modelScaffoldKey,
                      resizeToAvoidBottomInset: true,
                      body: FlatButton(
                        child: Text("Snackbar"),
                        onPressed: () {
                          _modelScaffoldKey.currentState.showSnackBar(SnackBar(
                            content: Text("Snackbar"),
                          ));
                        },
                      )),
                );

DartPad

Answer 2

Just wrap your child widget with Scaffold

await showModalBottomSheet(
   context: context,
   builder: (builder) => Scaffold(
      body: YourModalContentWidget()
   )
);