Open In App

Fluttertoast in Flutter

Last Updated : 25 Sep, 2022
Like Article

Fluttertoast is used to create a toast message by writing only one line of code. Below are some steps to create a Fluttertoast in Flutter. Basically here, we are creating a new Flutter application using a command prompt.

folder creation through cmd

  • Delete the default code from the main.dart file and write your own code.
  • Now, add fluttertoast in dependencies of the pubspec.yaml file:

Some Properties of showToast:

  • msg: toast message.
  • toastLength: Duration of toast
  • backgroundColor: Background color to be shown.
  • textColor: Text color to be shown.
  • fontSize: Font size of toast message.

Example: main.dart


import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';
void main() {
  runApp(const MyApp());
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);
// This widget is the
// root of your application.
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Flutter Demo",
      theme: ThemeData(
      debugShowCheckedModeBanner: false,
      home: const MyHomePage(),
class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key}) : super(key: key);
// ignore: library_private_types_in_public_api
  _MyHomePageState createState() => _MyHomePageState();
class _MyHomePageState extends State<MyHomePage> {
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("GeeksforGeeks"),
      body: Center(
        child: TextButton(
          onPressed: () {
              msg: 'GeeksforGeeks',
              backgroundColor: Colors.grey,
          child: Container(
            padding: const EdgeInsets.all(14),
            child: const Text(
              'Show Toast',
              style: TextStyle(color: Colors.white),
        // FlatButton is deprecated. Use TextButton instead.
        // child: FlatButton(
        //   color:,
        //   onPressed: () {
        //     Fluttertoast.showToast(
        //       msg: "GeeksforGeeks",
        //       backgroundColor: Colors.grey,
        //       // fontSize: 25
        //       // gravity: ToastGravity.TOP,
        //       // textColor:
        //     );
        //   },
        //   child:
        //       const Text("Show toast", style: TextStyle(color: Colors.white)),
        // ),


fluttertoast in flutter

If the font size is set to 25 the design changes as follows:

flutte with font size set

If the font size is set to 25 and gravity is set to  ToastGravity.TOP the design changes as follows:

flu with gravity

If the font size is set to 25 and gravity is set to ToastGravity.TOP and text color is set to pink the design changes as follows:

fluttertoast in flutter with gravity and text color set

If you are Not Comfortable using Dependency then just use the below snippet:


   .showSnackBar(SnackBar(content: Text(“My amazing message! O.o”))); 

Customize SnackBar for your own.

Like Article
Suggest improvement
Share your thoughts in the comments

Similar Reads