flutter_hot_toast

插件介绍

基于插件公开信息、社区数据与项目使用情况整理的选型参考。

一个轻量级且带有动画效果的吐司通知包，灵感来自 React Hot Toast。它提供流畅、视觉上吸引人的吐司消息，设置简单。支持 Android、iOS、Web、macOS、Windows 和 Linux 等多个平台。非常适合以现代、引人入胜的方式传递简短的用户反馈。

适合场景

显示快速用户反馈
显示成功或错误消息
通过细微的动画增强用户界面
提供临时警报
通过视觉提示改善用户体验

主要特点

流畅的动画
最小配置
跨平台支持
可自定义外观
简单 API
响应式设计

适合对象

初学者 Flutter 开发者
需要轻量级通知的应用程序
注重界面打磨的项目
快速原型设计
用户友好的界面

使用建议

超出基础样式的定制选项有限
不适合复杂的通知工作流
依赖外部动画库
可能需要额外的样式以支持深色模式
最适合简单、短暂的消息

原始 README

以下为关联源码仓库的 README 原文快照，最新内容请访问源码仓库。

Flutter Hot Toast

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

Features

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

搜索插件、代码仓与 APP 分类

安装插件