48

I want to dismiss SnackBar on SnackBarAction's onPressed method. I tried with Navigator.of(context).pop(); but SnackBar is not dismissing my screen get black instead.

Here is code:

 void showInSnackBar(String value) {
homeScaffoldKey.currentState.showSnackBar(new SnackBar(content: new Text(value),
  action: SnackBarAction(
    label: 'Dissmiss',
    textColor: Colors.yellow,
    onPressed: () {
    //  Navigator.of(context).pop();
    },
  ),));
}

11 Answers 11

87

You can also use,

Scaffold.of(context).hideCurrentSnackBar();

Be careful when you use context, use the correct context.

NOTE

In the new Flutter Version, this method is deprecated. Therefore use

ScaffoldMessenger.of(context).hideCurrentSnackBar();
2
  • 5
    You can also use Scaffold.of(context).removeCurrentSnackBar() to dismiss the SnackBar immediately without the exit animation. Jan 8, 2020 at 16:12
  • Better use keys instead of context, Apr 5, 2021 at 10:37
56

Try using hideCurrentSnackBar method

onPressed: () {
    homeScaffoldKey.currentState.hideCurrentSnackBar();
},

Update

Use ScaffoldMessenger instead, heee you have the guide:

https://docs.flutter.dev/release/breaking-changes/scaffold-messenger

More info here: https://api.flutter.dev/flutter/material/ScaffoldMessengerState/hideCurrentSnackBar.html

1
17
ScaffoldMessenger.of(context).hideCurrentSnackBar();
1
  • 2
    this is the latest answer for anyone new here --> since Flutter 2.0 the scaffold.snackbar is deprecated and the scaffold messenger is the new way to go Mar 15, 2021 at 8:48
7

If you want to replace snackbar that show only one time,

  final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();
  final snackBar = SnackBar(content: Text("Hello, world"));

And also,

@override
Widget build(BuildContext context) {
return Scaffold(
  key: _scaffoldKey,

And also,

onPressed: () {
    _scaffoldKey.currentState.removeCurrentSnackBar();
    _scaffoldKey.currentState.showSnackBar(snackBar);
     }
1
  • I liked this solution because it immediately removes snack bar. (I think) In my case I am not left with a queue of snack bar animations playing if a series of "showSnackBar()" calls are made.
    – AndrewS
    Jun 27, 2020 at 0:15
7

To clear the previous snackbars & show only the new one, use removeCurrentSnackBar method rather than hideCurrentSnackBar as it does not clear the stack. So the code will be

ScaffoldMessenger.of(context) 
  ..removeCurrentSnackBar()
  ..showSnackBar(snackBar);
4

Define your SnackBar:

var snackBar = SnackBar(content: Text('Hello World'));

To show it:

ScaffoldMessenger.of(context).showSnackBar(snackBar);

To hide it:

ScaffoldMessenger.of(context).hideCurrentSnackBar();

To hide the last one and show a new one:

ScaffoldMessenger.of(context) 
  ..hideCurrentSnackBar()
  ..showSnackBar(snackBar);
2

All these answers will not work because you cannot reference the ScarfoldMessenger from a Snackbar. You'll have to save a reference to the snackbar and call it's "close" method. Like so void Function () close; var snackbar = ScaffoldMessenger.of(context).showsnackbar(Snackbar (content:Text(), action: SnackbarAction(onPressed:()=>close())) close = ()=> snackbar.close();

1

Scaffold.of(context).hideCurrentSnackBar(); Above method is used previously but,

ScaffoldMessenger.of(context).hideCurrentSnackBar(); This is now recommended.

1

You can also show and dismiss a snackbar like this without any key

ScaffoldMessenger.of(context).showSnackBar(
  SnackBar(
    content: Text('Hello from snackbar!'),
    action: SnackBarAction(
      label: 'Dissmiss',
      textColor: Colors.yellow,
      onPressed: () {
        ScaffoldMessenger.of(context).hideCurrentSnackBar();
      },
    ),
  ),
);
1

As today using Flutter v3 there seems to be even a simpler solution to dismiss the Snackbar, which is shown on Flutter official cookbook, not sure if it works the same on previous versions.

It's as simple as passing an empty function to onPressed

final snackBar = SnackBar(
  content: const Text('Yay! A SnackBar!'),
  action: SnackBarAction(
    label: 'Close',
    onPressed: () {},
  ),
);
0
IconButton(
        // 1
        icon: Icon(_isFavorited ? Icons.favorite : Icons.favorite_border),
        iconSize: 30,
        // 2
        color: Colors.red[400],
        onPressed: () {
          // 3
          setState(() {
            _isFavorited = !_isFavorited;
            if (_isFavorited) {
              final snackBar = SnackBar(
                content: const Text('Added to favorite'),
                action: SnackBarAction(
                    label: 'Ok',
                    onPressed: () {
                      ScaffoldMessenger.of(context).hideCurrentSnackBar();
                    }),
              );
              ScaffoldMessenger.of(context).showSnackBar(snackBar);
            } else {
              final snackBar = SnackBar(
                content: const Text('removed from Favorite'),
                action: SnackBarAction(
                    label: 'Ok',
                    onPressed: () {
                      ScaffoldMessenger.of(context).hideCurrentSnackBar();
                    }),
              );
              ScaffoldMessenger.of(context).showSnackBar(snackBar);
            }
          });
        },
      )

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.