how to show a snack bar from the top of the screen in flutter code example

Example 1: how to show snackbar in flutter

You can show material design snackbars using the following code:

Scaffold.of(context).showSnackBar(SnackBar(
      content: Text("New Notification"),
    ));
   
In some cases, this will throw an error and it can be resolved using a workaround:

//Declare a GlobalKey
GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();

//Assing this key to the scaffold
Scaffold(
  key: _scaffoldKey,
  body: ...
)

//finally in the topmost code use this key in the following way
_scaffoldKey.showSnackBar(SnackBar(
      content: Text("New Notification"),
    ));

Example 2: Flutter snackbar top

RaisedButton(
  child: Text('Show Top Snackbar'),
  onPressed: () {
    Flushbar(
      flushbarPosition: FlushbarPosition.TOP,
    )
      ..title = "Hey Ninja"
      ..message = "Lorem Ipsum is simply dummy text of the printing and typesetting industry"
      ..duration = Duration(seconds: 3)
      ..show(context);
  },
),

Tags:

Misc Example