Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter Showing Snackbar On Top of Bottom Sheet

In my code I call a bottom sheet to display a list of tiles. These tiles contain buttons that display a snackbar. That functionality works fine, the only issue is that the snackbar is displayed behind the bottom sheet so you can only see it if you close the bottom sheet. Each of them are called with the following code:

1. Bottom Sheet:

  void _settingModalBottomSheet(context, stream, scaffoldKey ) {
    if (_availableRides.length == 0) {
      return null;
    } else {
      return scaffoldKey.currentState.showBottomSheet((context) {
        return Column(
          children: Widgets;
      });
    }
  }

2. Snackbar

widget.scaffoldKey.currentState.showSnackBar(SnackBar(
         content: Text("Created", textAlign: 
    TextAlign.center,),),

Does anyone know how I can position the snackbar in front of the bottom sheet

like image 997
Samuel Drescher Avatar asked Mar 13 '19 05:03

Samuel Drescher


People also ask

How do you show SnackBar on top of bottom sheet in Flutter?

First, we need to show the Modal Bottom Sheet by clicking the button. We can have the bottom sheet with showModalBottomSheet method. As we can see above, we are using Scaffold in the builder of showModalBottomSheet , it is because it provides us the context for our SnackBar.

How do I change the position on my SnackBar Flutter?

You can do this by placing a container inside the snackbar. Since snackbar can take any widget and you can change its background color to transparent, you can use a container with custom padding and borders to give an illusion of positioning. Save this answer.


1 Answers

So I was able to solve this by just adding another Scaffold() to my Bottom sheet and passing it a new scaffold key

like image 68
Samuel Drescher Avatar answered Sep 28 '22 10:09

Samuel Drescher