toast_widget 0.1.0

  • Readme
  • Changelog
  • Example
  • Installing
  • 4

Toast Widget #

Why did I create this? #

As you know Flutter does not support Toast by default and Snackbar needs "context" object to show message. That hinders our ability to show a global Toast message from anywhere.

What does it do? #

With toast_widget we can simply call

Toast.show("Hello world");

From anywhere in the app and it will show Toast like shown in the Image Above.

How to use it? #

  1. Add toast_widget to pubspec.yml

    toast_widget: ^0.1

  1. Import Toast Wiget import 'package:toast_widget/toast.dart';

  2. Now wrap your widget inside Toast Widget

    a. Just Wrap any Widget with ToastWidget() like this

     child: ToastWidget(
         child: SettingPage(),
     ),
    

    b. You can also use the extension method .enableToast() on any Widget:

     child: SettingPage().enableToast(),
    
  1. Finally, call Toast.show() from anywhere in the app.

    a. Just Show Text :

     Toast.show("Hello Toast");
    

    b. Show Toast with additional setting:

     Toast.show(
     "Hello Toast",
     mode: ToastMode.INFO,
     duration: Duration(milliseconds: 500)
     );
    

Parameter info :

Mode #

mode:

// ToastMode.INF0 - Green Background
// ToastMode.DEBUG - Blue Background
// ToastMode.ERROR - Red Background

Duration #

duration:

// Give Duration for how long do you want the toast to show and disappear itself.

// User can also click the 'X' icon on the Toast to close.

[0.1.0] - May 8 2020 Initial release #

example/lib/main.dart

import 'dart:async';
import 'dart:math';

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

StreamController<bool> isLightTheme = StreamController();

main() {
  runApp(MainApp());
}

class MainApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return StreamBuilder<bool>(
        initialData: true,
        stream: isLightTheme.stream,
        builder: (context, snapshot) {
          return MaterialApp(
              theme: snapshot.data ? ThemeData.light() : ThemeData.dark(),
              debugShowCheckedModeBanner: false,
              home: Scaffold(
                  appBar: AppBar(title: Text("Toast Widget Example")),
                  body: ToastWidget(child: SettingPage())));
        });
  }
}

class SettingPage extends StatefulWidget {
  @override
  _SettingPageState createState() => _SettingPageState();
}

class _SettingPageState extends State<SettingPage> {
  String userName = "Press Fetch User Button";

  @override
  Widget build(BuildContext context) {
    return Padding(
        padding: const EdgeInsets.all(16.0),
        child: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Spacer(flex: 1),
              Row(mainAxisAlignment: MainAxisAlignment.center, children: <
                  Widget>[
                RaisedButton(
                    color: Colors.blue,
                    child: Text("Light Theme",
                        style: TextStyle(color: Colors.white)),
                    onPressed: () {
                      Toast.show("Light Theme Applied", mode: ToastMode.DEBUG);
                      isLightTheme.add(true);
                    }),
                RaisedButton(
                    color: Colors.black,
                    child: Text("Dark Theme",
                        style: TextStyle(color: Colors.white)),
                    onPressed: () {
                      Toast.show("Dark Theme Applied", mode: ToastMode.ERROR);
                      isLightTheme.add(false);
                    }),
              ]),
              Spacer(
                flex: 1,
              ),
              Padding(
                padding: const EdgeInsets.only(top: 32),
                child: RaisedButton(
                  color: Colors.blue,
                  onPressed: () async {
                    var name = await getUserNameFromBackend();
                    setState(() {
                      userName = name;
                    });
                  },
                  child:
                      Text("Fetch User", style: TextStyle(color: Colors.white)),
                ),
              ).enableToast(),
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text("User Name : $userName"),
              ),
              Spacer(
                flex: 1,
              ),
            ],
          ),
        ));
  }
}

Future<String> getUserNameFromBackend() async {
  await Future.delayed(Duration(milliseconds: 400));
  var success = Random().nextInt(30) % 4 != 0;
  Toast.show(success ? "User Fetch Success" : "User Fetch Failed",
      mode: success ? ToastMode.INFO : ToastMode.ERROR,
      duration: Duration(milliseconds: 500));
  return success ? "Laxman Bhattarai" : "User Fetch Error";
}

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  toast_widget: ^0.1.0

2. Install it

You can install packages from the command line:

with pub:


$ pub get

with Flutter:


$ flutter pub get

Alternatively, your editor might support pub get or flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:toast_widget/toast_widget.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
9
Health:
Code health derived from static analysis. [more]
--
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
--
Overall:
Weighted score of the above. [more]
4
Learn more about scoring.

This package is not analyzed, because it is discontinued.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.6.0 <3.0.0