Custom Toast - Flutter

Last updated Feb 29, 2020


In This example we are going to use hot to create Custom Toast in Flutter.

For this we are going to use toast 0.1.5 plugin

Let's Start

Step 1: Create Flutter Application

Step 2: Add Dependencies

Add toast 0.1.5  in pubspec.yaml file

dependencies: toast: ^0.1.5

Step 3: Create a dart file and update below code

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

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

class _ShowToastState extends State {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Custom Toast Flutter')),
      body: Center(
          child: RaisedButton(
              child: Text('Show Toast',style: TextStyle(color: Colors.white),),
              color: Colors.red,
              onPressed: () => ToastView.createView('Showing Toast', context,
                 Toast.LENGTH_LONG, Toast.BOTTOM,Colors.pink,Colors.white,20,null))),
    );
  }
}

Step 4: Update main dart file with below code

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

class MyApp extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
      theme: ThemeData(
        primaryColor: Colors.pink
      ),
      home: ShowToast(),
    );
  }

}

 

Step 5: Let's Run application
 

Custom Toast Flutter


Article Contributed By :
https://www.rrtutors.com/site_assets/profile/assets/img/avataaars.svg

2124 Views

Subscribe For Daily Updates

Flutter Questions
Android Questions