How to display and customize toast in flutter

This package is a fun one. It allows you to display toast in your app. Simple!

First import the toast package from pub.

Pubspec.yaml

toast: any

Create any dart file and add this:

import 'package:flutter/material.dart';
import 'package:toast/toast.dart';

class ShowToast extends StatefulWidget {
  @override
  _ShowToastState createState() => _ShowToastState();
}

class _ShowToastState extends State<ShowToast> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Show Toast Example')),
      body: Center(
          child: RaisedButton(
              child: Text('Show Toast'),
              color: Colors.red,
              onPressed: () => Toast.show('An Example Toast', context,
                  duration: Toast.LENGTH_LONG, gravity: Toast.BOTTOM))),
    );
  }
}

Main.dart file:

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Code Snippets',
      theme: new ThemeData(primarySwatch: Colors.red),
      home: new ShowToast(),
    );
  }
}

If you have any questions or suggestions kindly use the comment box or you can contact us directly through our contact page below.

Add a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.