Flutter Hot Toast

A very cool and simple flutter toast that is highly inspired by React Hot Toast

Features

Video preview

Getting started

First wrap your Material App with GlobalLoaderOverlay

Widget build(BuildContext context) {
    return GlobalLoaderOverlay(
      child: MaterialApp(
        title: 'Flutter Demo',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: const Home(),
      ),
    );
  }

Now you can call the toast to show in any part of your widget that is being encapsulated in the MaterialApp widget by:

context.loaderOverlay.show(
            widget: FlutterHotToast.loading(
              height: 70,
              width: 280,
              label: const Text(
                'loading...😬',
                style: TextStyle(
                  fontSize: 30,
                ),
              ),
            ),
          );

Usage

FloatingActionButton(
        child: const Icon(Icons.add),
        onPressed: () {
          context.loaderOverlay.show(
            widget: FlutterHotToast.loading(
              height: 70,
              width: 280,
              label: const Text(
                'loading...😬',
                style: TextStyle(
                  fontSize: 30,
                ),
              ),
            ),
          );
          Future.delayed(const Duration(seconds: 2), () {
            context.loaderOverlay.show(
              widget: FlutterHotToast.success(
                context,
                height: 70,
                width: 280,
                label: const Text(
                  'success ✅',
                  style: TextStyle(
                    fontSize: 30,
                  ),
                ),
              ),
            );
          });
        },
      ),

Additional information

This package uses lottie, loader_overlay and flutter_animate under the hood.

You can find the repository link at github to contribute to this project.


If you like this project, please follow me on github

Libraries

flutter_hot_toast