How to create Toast in Flutter

Question

Can I create something similar to Toasts in Flutter?

Just a tiny notification window that is not directly in the face of the user and does not lock or fade the view behind it.

Rowden

Answer 1

UPDATE: Scaffold.of(context).showSnackBar is deprecated in Flutter 2.0.0 (stable)

You can access the parent ScaffoldMessengerState using ScaffoldMessenger.of(context).

Then do something like

ScaffoldMessenger.of(context).showSnackBar(const SnackBar(
     content: Text("Sending Message"),
));

Snackbars are the official "Toast" from material design. See Snackbars.

Here is a fully working example:

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: Home(),
    );
  }
}

class Home extends StatelessWidget {
  const Home({
    Key key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Snack bar'),
      ),
      body: Center(
        child: RaisedButton(
          onPressed: () => _showToast(context),
          child: const Text('Show toast'),
        ),
      ),
    );
  }

  void _showToast(BuildContext context) {
    final scaffold = ScaffoldMessenger.of(context);
    scaffold.showSnackBar(
      SnackBar(
        content: const Text('Added to favorite'),
        action: SnackBarAction(label: 'UNDO', onPressed: scaffold.hideCurrentSnackBar),
      ),
    );
  }
}

Eximious

How should this be wrapped inside an onPressed for example ? because I have tried it and nothing shows up on the screen. – Rowden

Well, I never fit the mould and I know "official" doesn't mean absolute!! The Snackbar really sucks for my app UX so I stay well clear of it and always implement the older floating popup style notification. I feel it's very easy for users to miss Snackbar notifications (especially if they're not used to it); but it's not easy to miss a popup floating in the middle, top or bottom of the screen. – Kayleen

@aziza wrap you button widget in Builder(), it will work – Yamamoto

The widget calling showSnackBar() should have a Scaffold parent. – Abreu

Note: If you are using Snackbar solution as mentioned in the answer and want to have something closer to traditional Android Toast view, use floating behavior in Snackbar like -> "behavior: SnackBarBehavior.floating". It will detach Snackbar from bottom and you will have something closer to traditional toast. – Selassie

Getting error - 'showSnackBar' is deprecated and shouldn't be used. Use ScaffoldMessenger.showSnackBar. This feature was deprecated after v1.23.0-14.0.pre.. Try replacing the use of the deprecated member with the replacement. – Opheliaophelie

This is now deprecated! The new version is ScaffoldMessage.showSnackBar(). – Pitt

It shows error like `The following assertion was thrown during a scheduler callback: There are multiple heroes that share the same tag within a subtree. Within each subtree for which heroes are to be animated (i.e. a PageRoute subtree), each Hero must have a unique non-null tag. In this case, multiple heroes had the following tag: <SnackBar Hero tag - WillPopScope> Here is the subtree for one of the offending heroes: Hero tag: <SnackBar Hero tag - WillPopScope> state: _HeroState when snackbar message is being displayed and user clicks on another button or icon to navigate – Opheliaophelie

@remi Remi - Kindly see my last message and suggest me how can we fix this issue? Thanks a lot. – Opheliaophelie

Nothing works for me but this one – Auston

Answer 2

Use fluttertoast plugin

add this line to your dependencies

fluttertoast: ^8.1.1

Then you can use Toast with No Build Context (has limited features and no control over UI, please check the doc)

Fluttertoast.showToast(
        msg: "This is a Toast message",
        toastLength: Toast.LENGTH_SHORT,
        gravity: ToastGravity.CENTER,
        timeInSecForIosWeb: 1,
        textColor: Colors.white,
        fontSize: 16.0
    );

Gurule

You have to first add the Fluttertoast dependecy in the pubspec.yaml file. Link to the dependency is here [link] (pub.dartlang.org/packages/fluttertoast). Then you can use the above code – Liverpool

Unhandled Exception: MissingPluginException(No implementation found for method showToast on channel PonnamKarthik/fluttertoast) – Kilauea

Now it works, i need to stop the app and Run 🏃‍♂️ without debugging :) – Kilauea

Anyone faced the issue that the round border is disabled after setting bg color github.com/PonnamKarthik/FlutterToast/issues/156 – Foscalina

I just added a custom motion toast. Awesome! pub.flutter-io.cn/packages/motion_toast – Rhee

@SachinSolanki You need to run in production mode to be able to see it flutter run --release – Testaceous

it has some error in web and some deprecation warning in android like this"FlutterToastPlugin.kt:9:48: warning: 'Registrar' is deprecated. Deprecated in Java ... Unit' is deprecated. Deprecated in Java" – Alary

Not a well maintained library. Go for the accepted answer for a more standard approach. – Stroboscope

Answer 3

SnackBar is definitely the right class to use, as pointed out by Darky.

One tricky thing about showSnackBar is getting to the ScaffoldState, if you're trying to call showSnackBar within the build method where you construct your Scaffold.

You might see an error like this, which includes some text explaining how to solve the problem.

══╡ EXCEPTION CAUGHT BY GESTURE ╞═══════════════════════════════════════════════════════════════════
The following assertion was thrown while handling a gesture:
Scaffold.of() called with a context that does not contain a Scaffold.
No Scaffold ancestor could be found starting from the context that was passed to Scaffold.of(). This
usually happens when the context provided is from the same StatefulWidget as that whose build
function actually creates the Scaffold widget being sought.
There are several ways to avoid this problem. The simplest is to use a Builder to get a context that
is "under" the Scaffold. For an example of this, please see the documentation for Scaffold.of():
  https://docs.flutter.io/flutter/material/Scaffold/of.html
A more efficient solution is to split your build function into several widgets. This introduces a
new context from which you can obtain the Scaffold. In this solution, you would have an outer widget
that creates the Scaffold populated by instances of your new inner widgets, and then in these inner
widgets you would use Scaffold.of().
A less elegant but more expedient solution is assign a GlobalKey to the Scaffold, then use the
key.currentState property to obtain the ScaffoldState rather than using the Scaffold.of() function.
The context used was:
  MyHomePage
When the exception was thrown, this was the stack:
#0      Scaffold.of (package:flutter/src/material/scaffold.dart:444:5)
#1      MyHomePage.build.<anonymous closure> (/Users/jackson/Library/Developer/CoreSimulator/Devices/7072C907-DBAD-44FE-8F40-0257442C51D9/data/Containers/Data/Application/77FEC1A4-1453-442C-8208-96E0323DEFB2/tmp/so_scratch2Tkq9Jb/so_scratch2/lib/main.dart:23:24)
#2      _InkResponseState._handleTap (package:flutter/src/material/ink_well.dart:323:14)
#3      _InkResponseState.build.<anonymous closure> (package:flutter/src/material/ink_well.dart:375:30)
#4      GestureRecognizer.invokeCallback (package:flutter/src/gestures/recognizer.dart:102:24)
#5      TapGestureRecognizer._checkUp (package:flutter/src/gestures/tap.dart:149:9)
#6      TapGestureRecognizer.acceptGesture (package:flutter/src/gestures/tap.dart:119:7)
#7      GestureArenaManager.sweep (package:flutter/src/gestures/arena.dart:156:27)
#8      BindingBase&SchedulerBinding&GestureBinding.handleEvent (package:flutter/src/gestures/binding.dart:147:20)
#9      BindingBase&SchedulerBinding&GestureBinding.dispatchEvent (package:flutter/src/gestures/binding.dart:121:22)
#10     BindingBase&SchedulerBinding&GestureBinding._handlePointerEvent (package:flutter/src/gestures/binding.dart:101:7)
#11     BindingBase&SchedulerBinding&GestureBinding._flushPointerEventQueue (package:flutter/src/gestures/binding.dart:64:7)
#12     BindingBase&SchedulerBinding&GestureBinding._handlePointerDataPacket (package:flutter/src/gestures/binding.dart:48:7)
#13     _invoke1 (file:///b/build/slave/Mac_Engine/build/src/flutter/lib/ui/hooks.dart:100)
#14     _dispatchPointerDataPacket (file:///b/build/slave/Mac_Engine/build/src/flutter/lib/ui/hooks.dart:58)
Handler: onTap
Recognizer:
  TapGestureRecognizer#69dbc(debugOwner: GestureDetector, state: ready)
════════════════════════════════════════════════════════════════════════════════════════════════════

You can either pass a GlobalKey to your Scaffold constructor:

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final key = new GlobalKey<ScaffoldState>();
    return new Scaffold(
      key: key,
      floatingActionButton: new Builder(
        builder: (BuildContext context) {
          return new FloatingActionButton(
            onPressed: () {
              key.currentState.showSnackBar(new SnackBar(
                content: new Text("Sending Message"),
              ));
            },
            tooltip: 'Increment',
            child: new Icon(Icons.add),
          );
        }
      ),
    );
  }
}

Or you can use a Builder to create a BuildContext that is a child of the Scaffold.

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      floatingActionButton: new Builder(
        builder: (BuildContext context) {
          return new FloatingActionButton(
            onPressed: () {
              Scaffold.of(context).showSnackBar(new SnackBar(
                content: new Text("Sending Message"),
              ));
            },
            tooltip: 'Increment',
            child: new Icon(Icons.add),
          );
        }
      ),
    );
  }
}

Finally, you could split your widget into multiple classes, which is the best long-term approach.

Averroism

Tried GlobalKey, Now I am getting this exception: I/flutter ( 4965): The following assertion was thrown while handling a gesture: I/flutter ( 4965): type 'LabeledGlobalKey<ScaffoldState>' is not a subtype of type 'BuildContext' of 'context' where I/flutter ( 4965): LabeledGlobalKey is from package:flutter/src/widgets/framework.dart I/flutter ( 4965): ScaffoldState is from package:flutter/src/material/scaffold.dart I/flutter ( 4965): Scaffold is from package:flutter/src/material/scaffold.dart I/flutter ( 4965): BuildContext is from package:flutter/src/widgets/framework.dart – Cohby

It looks like you're using a GlobalKey as an argument where a BuildContext is expected. I can't help you debug this further without seeing more of your code. Please post the line of code that is throwing the exception, probably you just aren't using the right arguments. – Averroism

I can confirm that using the Builder option you gave works well. Ran into this issue and this solved it for me. – Thundershower

I got an error with GlobalKey method but taking the declaration final key = new GlobalKey<ScaffoldState>(); outside of Widget build fixed it. – Deafening

Answer 4

To show a Toast message you can use the FlutterToast plugin. To use this plugin, you have to:

1. Add this dependency to your pubspec.yaml file: fluttertoast: ^8.0.8
2. To get the package, you have to run this command: $ flutter packages get
3. import the package: import 'package:fluttertoast/fluttertoast.dart';

Use it like this:

Fluttertoast.showToast(
    msg: "your message",
    toastLength: Toast.LENGTH_SHORT,
    gravity: ToastGravity.BOTTOM, // Also possible "TOP" and "CENTER"
    backgroundColor: "#e74c3c",
    textColor: '#ffffff'
);

For more information, check documentation.

Cestus

this is not working now. upgrade plugin instead – Drescher

yes answer was old I hade updated the answer – Cestus

Answer 5

fluttertoast: ^3.1.3

import 'package:fluttertoast/fluttertoast.dart';

Fluttertoast.showToast(
        msg: "This is Center Short Toast",
        toastLength: Toast.LENGTH_SHORT,
        gravity: ToastGravity.CENTER,
        timeInSecForIos: 1,
        backgroundColor: Colors.red,
        textColor: Colors.white,
        fontSize: 16.0
    );

Nickola

Please try to add descriptive sentence or two which describes where to put which code. Something like "Add package to your pubspec" and "In code, use:" – Ulterior

Answer 6

Snack Bar

When I tried to use a solution with using the ScaffoldState object (suggested by others), I got a warning that it is deprecated:

'showSnackBar' is deprecated and shouldn't be used. Use ScaffoldMessenger.showSnackBar. This feature was deprecated after v1.23.0-14.0.pre..

Using ScaffoldMessenger works as expected:

ScaffoldMessenger.of(context)
    .showSnackBar(SnackBar(content: Text("My amazing message! O.o")));

Example:

Couching

Answer 7

In case the Fluttertoast package given so far doesn’t work, then I will suggest you to try toast.

It has no frills and no ceremony.

It just works.

I noticed a bug within the example given within its README file though:

Toast.show(
"Toast plugin app",
 duration: Toast.LENGTH_SHORT,
 gravity:  Toast.BOTTOM);

While the method requires a context. So do well to add 'context' like this:

Toast.show(
"Toast plugin app", context,
 duration: Toast.LENGTH_SHORT,
 gravity: Toast.BOTTOM);

There is a chance that this would have been fixed by the time you checked though. I already submitted a PR.

Discontinuance

I prefer this plugin over the pub.dartlang.org/packages/fluttertoast plugin. This one is much cleaner [concise] and easier to customize. – Kayleen

Its not worked with null safety – Laura

Answer 8

For the toast message in Flutter, use the bot_toast library. This library provides a feature-rich, support for displaying notifications, text, loading, attachments, etc. Toast

Nehru

Answer 9

I would like to provide an alternative solution to use package flushbar.

As the package said: Use this package if you need more customization when notifying your user. For Android developers, it is made to substitute toasts and snackbars.

Another suggestion to use flushbar is How can I show a snackbar after navigator.pop(context) in Flutter?

You can also set flushbarPosition to TOP or BOTTOM:

    Flushbar(
      title: "Hey Ninja",
      message: "Lorem Ipsum is simply dummy text of the printing and typesetting industry",
      flushbarPosition: FlushbarPosition.TOP,
      flushbarStyle: FlushbarStyle.FLOATING,
      reverseAnimationCurve: Curves.decelerate,
      forwardAnimationCurve: Curves.elasticOut,
      backgroundColor: Colors.red,
      boxShadows: [BoxShadow(color: Colors.blue[800], offset: Offset(0.0, 2.0), blurRadius: 3.0)],
      backgroundGradient: LinearGradient(colors: [Colors.blueGrey, Colors.black]),
      isDismissible: false,
      duration: Duration(seconds: 4),
      icon: Icon(
        Icons.check,
        color: Colors.greenAccent,
      ),
      mainButton: FlatButton(
        onPressed: () {},
        child: Text(
          "CLAP",
          style: TextStyle(color: Colors.amber),
        ),
      ),
      showProgressIndicator: true,
      progressIndicatorBackgroundColor: Colors.blueGrey,
      titleText: Text(
        "Hello Hero",
        style: TextStyle(
            fontWeight: FontWeight.bold, fontSize: 20.0, color: Colors.yellow[600], fontFamily: "ShadowsIntoLightTwo"),
      ),
      messageText: Text(
        "You killed that giant monster in the city. Congratulations!",
        style: TextStyle(fontSize: 18.0, color: Colors.green, fontFamily: "ShadowsIntoLightTwo"),
      ),
    )..show(context);

Postcard

Answer 10

There is a three-way to show toast in a Flutter app.

I will tell you about all three ways that I know and choose which one you want to use. I would recommend the second one.

1: Using the external package.

This is the first method which is the easiest way to show toast in a Flutter app.

First of all, you have to add this package to file pubspec.YAML:

flutter_just_toast:^version_here

Then import the package in the file where you want to show a toast.

'package:flutter_just_toast/flutter_just_toast.dart';

And the last step shows the toast.

Toast.show(message: "Your toast message",
           duration: Delay.SHORT,
           textColor: Colors.black);

2: Using the official way.

This method is also simple, but you have to deal with it. I am not saying that it is hard it is simple and clean I would recommend this method.

For this method, all you have to do show toast is using the below code.

Scaffold.of(context).showSnackBar(SnackBar(
          content: Text("Sending Message"),
        ));

But remember that you have to use the scaffold context.

3: Using the native API.

Now, this method does not make sense any more when you already have the two methods above. Using this method, you have to write native code for Android and iOS and then convert it to plugin and you are ready to go.

This method will consume your time and you have to reinvent the wheel. Which has already been invented.

Canasta

Answer 11

Import the library fluttertoast: 3.1.3

Use it like below:

Fluttertoast.showToast(
    msg: "Hello, World!",
    textColor: Colors.white,
    toastLength: Toast.LENGTH_SHORT,
    timeInSecForIos: 1,
    gravity: ToastGravity.BOTTOM,
    backgroundColor: Colors.indigo,
);

Avian

Except for the version number it is (was) a copy-pasted Android Dev's answer (including all the grammar mistakes). – Underlayer

Answer 12

For the ones that are looking for a Toast what can survive the route changes, the SnackBar might not be the best option.

Have a look at Overlay instead.

Gaslight

Answer 13

Add flutter_just_toast to your dependencies in your Pubspecs.yaml file.

Dependencies:

flutter_just_toast: ^1.0.1

Next import the package into your class:

import 'package:flutter_just_toast/flutter_just_toast.dart';

Implement Toast with a message:

Toast.show(message: "Your toast message",
    duration: Delay.SHORT,
    textColor: Colors.black);

Jostle

Answer 14

Just use SnackBar(content: Text("hello"),) inside any event like onTap and onPress.

You can read more about Snackbar on Display a snackbar.

Idonah

Answer 15

For the Android original graphics toast, you can use this:

It works fine on Android and iOS.

Tightrope

Answer 16

Use https://pub.dev/packages/toast for toast. This library is pretty easy to use and perfectly works for iOS and Android.

Syntax for showing Toast:

Toast.show("Toast plugin app", duration: Toast.LENGTH_SHORT, gravity:  Toast.BOTTOM);

Isocline

Answer 17

You can use this package: toast

Add this line to your dependencies

toast: ^0.1.5

Then use it like this:

import 'package:toast/toast.dart';
Toast.show("Toast plugin app", context, duration: Toast.LENGTH_SHORT, gravity:  Toast.BOTTOM);

Heroics

Answer 18

Get the Flutter toast package here

Add this package to your project dependencies in file pubspec.yaml.

Then whenever you want the Toast to be shown, like on a tap of a button:

Toast.show("Toast plugin app", context, duration: Toast.LENGTH_SHORT, gravity: Toast.BOTTOM);

Autunite

Answer 19

You can use fluttertoast package. To do this, add it in the pubspec.yaml file like:

dependencies:
  fluttertoast: ^8.0.8

Then import that package in the .dart file you need the toast in and write your code.

For example, refer to the following code:

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

class ToastExample extends StatefulWidget {
    @override
    _ToastExampleState createState() {
      return _ToastExampleState();
    }
  }

  class _ToastExampleState extends State {
    void showToast() {
      Fluttertoast.showToast(
          msg: 'This is flutterToast example', // Message
          toastLength: Toast.LENGTH_SHORT,    // toast length
          gravity: ToastGravity.CENTER,      // position
          timeInSecForIos: 1,               // duaration
          backgroundColor: Colors.red,     // background color
          textColor: Colors.white         // text color
      );
    }

    @override
    Widget build(BuildContext context) {
      return MaterialApp(
        title: 'Toast Tutorial',
        home: Scaffold(
            appBar: AppBar(
              title: Text('Toast Tutorial'),
            ),
            body: Padding(
              padding: EdgeInsets.all(15.0),
              child: Center(
                child: RaisedButton(
                  child: Text('Show Toast'),
                  onPressed: showToast,
                ),
              ),
            )
        ),
      );
    }
  }

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

Octahedrite

Answer 20

For this, there are different versions.

1. First of all, you can use SnackBar which is a widget in Flutter.

2. You can use libraries like toast - flutter_toast from pub.dev.

3. The third version is creating your custom widget. It can be created using Overlay widget and Animation in Flutter.

You can this this tutorial to learn more about it. Here is a link.

Indemnify

Answer 21

The answer Scaffold.of(context).showSnackBar(...) has not worked in most cases.

I suggest the optimal method be declaring a scaffoldState key within the class and assigning it to Scaffold like below:

GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();

And then

Scaffold(
  key: _scaffoldKey,
  ...
)

When you want to show the Snackbar, do this:

_scaffoldKey.currentState.showSnackBar(SnackBar(
  content: Text("This works!"),
));

Cattleya

Answer 22

Use this:

Fluttertoast.showToast(
    msg: "This is a Toast message",
    toastLength: Toast.LENGTH_SHORT,
    gravity: ToastGravity.CENTER,
    timeInSecForIos: 1
);

Selfseeker

Answer 23

You can just straight away to use snack bar element

 ScaffoldMessenger.of(context).showSnackBar(
      SnackBar(
        content: Text("Successfully!"),
        behavior: SnackBarBehavior.floating,
        margin: EdgeInsets.all(20),
          shape: StadiumBorder(),
        action: SnackBarAction(
          label: 'Dismiss',
          disabledTextColor: Colors.white,
          textColor: Colors.blue,
          onPressed: () {
            //Do whatever you want
          },
        ),
      ),
    );

Abatis

Answer 24

Step 1:

Dependencies:

flutter_just_toast: ^1.0.1

---

Step 2:

import 'package:flutter_just_toast/flutter_just_toast.dart';

---

Step 3:

Toast.show(
  message: "Your toast message",
  duration: Delay.SHORT,
  textColor: Colors.black);

---

Pirouette

Answer 25

Use this dependency:

toast: ^0.1.3

Then import the dependency of toast in the page:

import 'package:toast/toast.dart';

Then on onTap() of the widget:

Toast.show("Toast plugin app", context, duration:Toast.LENGTH_SHORT, gravity: Toast.BOTTOM);

Uncut

Answer 26

There isn't any widget for toast in Flutter. You can go to this plugin.

Use case:

Fluttertoast.showToast(
    msg: "My toast message",
    textColor: Colors.white,
    toastLength: Toast.LENGTH_SHORT,
    timeInSecForIos: 1,
    gravity: ToastGravity.BOTTOM,
    backgroundColor: Colors.indigo,);

Mailbox

What is the trailing comma for? – Underlayer

Answer 27

Importcupertino_icons: ^0.1.2 and write the below code:

showToast(BuildContext context, String message) {
  showDialog(
    context: context,
    builder: (BuildContext context) {
      return CupertinoAlertDialog(
        title: Text(
          "Name of App",
        ),
        content: Text(
          message,
        ),
        actions: [
          CupertinoButton(
            child: Text("OK"),
            onPressed: () {
              Navigator.of(context).pop();
            },
          )
        ],
      );
    },
  );
});

Compassionate

Does this actually work? A } and three )s seem to be missing. – Underlayer

This does not work because dialogs do fade and darken the view behind them – Peneus

Answer 28

It's quite simple:

We just have to install the Flutter toast package. Refer to the following documentation: https://pub.dev/packages/fluttertoast

In the installing tab you will get the dependency which you have to paste it in the pubspec.yaml file and then install.

After this, just import the package:

import 'package:fluttertoast/fluttertoast.dart';

Similar to the above line.

And then by using FlutterToast class you can use your fluttertoast.

You're done!!!

Predicate

Answer 29

You can use this link to show Toast in Flutter.

Use this as:

void method1(){

    Fluttertoast.showToast(
        msg: "This is Add Button",
        toastLength: Toast.LENGTH_SHORT,
        gravity: ToastGravity.CENTER,
        timeInSecForIosWeb: 1,
        backgroundColor: Colors.blueGrey,
        textColor: Colors.white,
        fontSize: 14.0
    );
}

Drescher

Answer 30

You can easily achieve this effect using Overlay.

Code:

OverlayEntry entry = OverlayEntry(builder: (context) {
              return Positioned(
                  top: MediaQuery.of(context).size.height * 0.8,
                  child: Container(
                    width: MediaQuery.of(context).size.width,
                    alignment: Alignment.center,
                    child: const Card(
                      color: Colors.redAccent,
                      child: Padding(
                        padding: EdgeInsets.all(8),
                        child: Text("This is a message."),
                      ),
                    ),
                  ));
            });

            //show overlay
            Overlay.of(context)!.insert(entry);
            //auto remove this overlay after 3 seconds
            Future.delayed(const Duration(seconds: 3)).then((value) => entry.remove());

Screenshot:

Lauds

Answer 31

It's quite easy to show a Toast message in Flutter:

Scaffold.of(context).showSnackBar(SnackBar(
    content: Text("Toast Text Here"),
));

Arrest

How is this different from previous answers? – Underlayer

Answer 32

My trick without any extra package, just SnackBar

  final snackBar = SnackBar(
    backgroundColor: Colors.transparent,
    elevation: 0,
    dismissDirection: DismissDirection.none,
    padding: EdgeInsets.zero,
    margin: const EdgeInsets.only(bottom: 15),
    behavior: SnackBarBehavior.floating,
    duration: const Duration(seconds: 2),
    content: Center(
      child: Container(
        padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 14),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(50),
          color: Color(0xff656565),
        ),
        child: const Text('Click exit again to close app!'),
      ),
    ),
  );

  ScaffoldMessenger.of(context).showSnackBar(snackBar);

Yazzie

Answer 33

You can use something like FlutterToast.

Import the library:

fluttertoast: ^2.1.4

Use it like below:

Fluttertoast.showToast(
    msg: "Hello, World!",
    textColor: Colors.white,
    toastLength: Toast.LENGTH_SHORT,
    timeInSecForIos: 1,
    gravity: ToastGravity.BOTTOM,
    backgroundColor: Colors.indigo,
);

That's it...

Mcneely