How to check if there is a snack bar showing? - flutter

Question

I'm trying to get the current snack bar (showing one) to determine if it is the same snack that am trying to show or not ; in other words ,i don't want to duplicate the snack , but i couldn't get it.
I'v tried to google it up but nothing showed about it and what is really pissing me off is when i call Scaffold.of(context).showSnackBar(sb); multiple times they show will show one at a time until they end .
import 'package:flutter/material.dart';
const sb = SnackBar(
content: Text('the snack bar'),
);
void main() => runApp(MaterialApp(
title: 'Snack bar test',
home: Scaffold(
appBar: AppBar(
title: Text('snack bar demo'),
),
body: Center(
child: MyApp(),
),
),
));
class MyApp extends StatelessWidget {
const MyApp({Key key}) : super(key: key);
#override
Widget build(BuildContext context) {
return RaisedButton(
child: Text('push to test'),
onPressed: () {
// Scaffold.of(context).
Scaffold.of(context).showSnackBar(sb);
},
);
}
}
What i want to achieve is something like this :-
if (sb.isShowing()){
//hide or remove it
}
and thanks in advance .

Answer 1

You can use .close() event. It specifies how a snack bar is closed. Details here and Sample code below :
bool _isSnackbarActive = false ;
...
...
_isSnackbarActive = true ;
Scaffold.of(context)
.showSnackBar(SnackBar(content: Text("Title")))
.closed
.then((SnackBarClosedReason reason) {
// snackbar is now closed.
_isSnackbarActive = false ;
});
The variable _isSnackbarActive to true when snackBar is displayed and set it to false when it is closed. In your onPressed event, just check the status of the snackbar and decide if new snackbar is to be shown or not. In addition, per your requirement, you can check the text on the current snack bar to see if the intended snackbar and the current one are same.

Answer 2

To me this works fine, and don't need an external variable to control visibility status. Maybe would be helpful for others.
I think it isn't the best approach, because it will not prevent new SnackBars, it will just clean the "queue" on close.
ScaffoldMessenger.of(context)
.showSnackBar(_snackBar)
.closed
.then((value) => ScaffoldMessenger.of(context).clearSnackBars());

Answer 3

Use ScaffoldMessenger.of(context).removeCurrentSnackBar(); since Scaffold.of(context).removeCurrentSnackBar(); is deprecated.

Answer 4

Just call removeCurrentSnackBar() to remove the current snackbar.
import 'package:flutter/material.dart';
const sb = SnackBar(
content: Text('the snack bar'),
);
void main() => runApp(MaterialApp(
title: 'Snack bar test',
home: Scaffold(
appBar: AppBar(
title: Text('snack bar demo'),
),
body: Center(
child: MyApp(),
),
),
));
class MyApp extends StatelessWidget {
const MyApp({Key key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text('push to test'),
onPressed: () {
// Scaffold.of(context).
Scaffold.of(context).showSnackBar(sb);
},
),
RaisedButton(
child: Text('Remove snackbar'),
onPressed: () {
// Scaffold.of(context).
Scaffold.of(context).removeCurrentSnackBar();
},
),
],
);
}
}

Answer 5

Adding to what #Sukhi mentioned
//Set this in state
...
bool _isSnackbarActive = false;
...
.
.
.
//If you want to show snackBar on a button press
onPressed: () {
if (!_isSnackbarActive) {
showSnack();
}
//This is the showSnack(). When called it'll set the _isSnackbarActive to true and now even if you click on the button multiple times since it's true a new snackBar will not be shown. Once the current snackBar closes it set _isSnackbarActive to false and then it can be called again.
showSnack() {
setState(() {
_isSnackbarActive = true;
});
return ScaffoldMessenger.of(context)
.showSnackBar(SnackBar(content: Text("Posts updated!")))
.closed
.then((SnackBarClosedReason reason) {
// snackbar is now closed.
setState(() {
_isSnackbarActive = false;
});
});
}

Answer 6

There are two easy ways:
removeCurrentSnackBar will disappear without animation
ScaffoldMessenger.of(context).removeCurrentSnackBar();
ScaffoldMessenger.of(context).showSnackBar(const SnackBar(content: Text("snackbar text")));
hideCurrentSnackBar will disappear with animation
ScaffoldMessenger.of(context).hideCurrentSnackBar();
ScaffoldMessenger.of(context).showSnackBar(const SnackBar(content: Text("snackbar text")));
chose according to your design.