Toasts are messages that usually slide in from the top or bottom of the page. Since they slide or 'pop' in, they are nick-named toast - you know like toast popping out of your toaster. Pretty descriptive and sensible right?

So, how do you do toast messages in Flutter? You use a component named Snackbar. The name Snackbar comes form Google's Material Design. But just think of Snackbar=Toast and you will be fine...

A Simple Example of a Toast... ummmm... SnackBar

In this example we will create the simplest SnackBar. When a user submits the form a Snackbar appears confirming their action was successful.

class _MyHomePageState extends State<MyHomePage> {
  final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();

  void _submit() {
    SnackBar snackBar = new SnackBar(
        content: new Text("Changes saved at " + new DateTime.now().toString()));
    _scaffoldKey.currentState.showSnackBar(snackBar);
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      key: _scaffoldKey,
      appBar: new AppBar(
        title: new Text('My Form'),
        backgroundColor: Colors.deepOrangeAccent,
      ),
      body: new Padding(
        padding: const EdgeInsets.all(16.0),
        child: new Form(
          autovalidate: true,
          child: new Column(
            children: [
              new TextFormField(
                decoration: new InputDecoration(labelText: 'Enter something'),
              ),
              new RaisedButton(
                onPressed: _submit,
                child: new Text('Save'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Adding a Button

Let's add a simple button to the SnackBar. When the button is clicked, the content is copied to the clipboard. Here is the new definition for the SnackBar.

  void _submit() {
    String msg = "Changes saved at " + new DateTime.now().toString();
    SnackBar snackBar = new SnackBar(
      content: new Text(msg),
      action: SnackBarAction(
        label: 'Copy',
        onPressed: () {
          Clipboard.setData(new ClipboardData(text: msg));
          print("Successfully copied " + msg + " to clipboard");
        },
      ),
    );
    _scaffoldKey.currentState.showSnackBar(snackBar);
  }

Add Some Styling

So far our Snackbar is rather bland. Let's change it's color. Doing so is easy by specifying something for the backgroundColor. In this example we switched it to a nice Amber color

SnackBar snackBar = new SnackBar(
    content: new Text(msg),
    action: SnackBarAction(
    label: 'Copy',
    onPressed: () {
        Clipboard.setData(new ClipboardData(text: msg));
        print("Successfully copied " + msg + " to clipboard");
    },
    ),
    backgroundColor: Colors.amber,
);

Adjust the Duration

By default the SnackBar appears for 4 seconds. Let's double that to give the user a little more time to click the Copy button on the SnackBar if they desire. Just add this line directly below the backgroundColor property you just specified in the last example:

duration: new Duration(seconds: 8),

Summary

As you can see, SnackBars (or Toast messages if you prefer) are simple enough in Flutter.