close
How to create Toast in Flutter

How to create Toast in Flutter With Example

Hello Guys How are you all? Hope You All Are Fine. Today We Are Going To Learn How to create Toast in Flutter with example? with This Tutorial. As a Developer, you need to show users toast messages.

In This tutorial, we are going to learn to show toast messages in a very simple way as well as create custom toasts. We will use the toast Package. so without wasting your time let’s start this article.

How to create Toast in Flutter?

  1. How to create Toast in Flutter?

    To create Toast in Flutter is quite simple. All we need is just add dependency in our pubspec.yaml file get dependency and then just make a global method to use it globally. you can just use the ShowToast method from the dependency's method. here is a quick example.

  2. create Toast in Flutter

    create Toast in Flutter is quite simple. All we need is just add dependency in our pubspec.yaml file get dependency and then just make a global method to use it globally. you can just use the ShowToast method from the dependency's method. here is a quick example.

  3. Toast in Flutter

    Toast in Flutter is quite simple. All we need is just add dependency in our pubspec.yaml file get dependency and then just make a global method to use it globally. you can just use the ShowToast method from the dependency's method. here is a quick example.

  • First of all add this line to your dependencies.
dependencies:
  flutter:
    sdk: flutter
  toast: ^0.1.5
  • Now click on get dependencies to get that dependencies.
  • Then, add this line in your file.
import 'package:toast/toast.dart';
  • Now, you can use this package in your file.
  • Now i am sharing my personal method here that will easy to use
  • You Have to make class and define your class name. [ You can Create saparate Dart file too. But I am using same file where i want to use toast. 🙂 ] Same like Below.
class ShowToastComponent {
  static showDialog(String msg, context) {
    Toast.show(
      msg,
      context,
      duration: Toast.LENGTH_SHORT,
      gravity: Toast.BOTTOM,
    );
  }
}
  • Now, You can Use this class any where in your file. Let me Give You Quik Example here.
  • I am use toast on RaisedButton click same like below
        body: Center(
          child: RaisedButton(
            child: Text('Show Short Toast'),
            onPressed: () => ShowToastComponent.showDialog(
                "Your Toast Message", context),
          ),
        ),
  • I am Giving You my full source code here for batter understanding.

My Full Source Code

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

class ShowToast extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Toast Example - FlutterCorner'),
          backgroundColor: Colors.black,
        ),
        body: Center(
          child: RaisedButton(
            child: Text('Show Short Toast'),
            onPressed: () =>
                ShowToastComponent.showDialog("Your Toast Message", context),
          ),
        ),
      ),
    );
  }
}

class ShowToastComponent {
  static showDialog(String msg, context) {
    Toast.show(
      msg,
      context,
      duration: Toast.LENGTH_SHORT,
      gravity: Toast.BOTTOM,
    );
  }
}

Output

How to create Toast in Flutter

Summery

So, It’s All About How to create Toast in Flutter With Example?. I hope this tutorial helps you to Solve your error. Please Comment Below if You stucks anywhere with my code. And please comment below on which solution worked for you. Thank You.

Also Check Out Below Tutorials


Posted

in

, ,

by

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *