Flutter - okToast封装

2023-11-20

###### demo 地址: https://github.com/iotjin/jh_flutter_demo

使用版本

#加载框 https://pub.flutter-io.cn/packages/oktoast#-readme-tab-
oktoast: ^2.3.1+1

包地址

###  oktoast packages地址

使用方法

//需要包裹 MaterialApp
    OKToast(
//      dismissOtherOnShow: true,
      child: MaterialApp(),
    )

JhToast2.showText("这是一条提示文字");
JhToast2.showSuccess("加载成功");
JhToast2.showError("加载失败");


JhToast2.showLoadingText();
   Future.delayed(Duration(seconds: 5), () {
   /// hide toast
    JhToast2.hideHUD();
});


代码

/**
 *  JhToast2.dart
 *
 *  Created by iotjin on 2020/02/25.
 *  description:  oktoast封装
 */
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:oktoast/oktoast.dart';

const Color _bgColor = Colors.black87;
const double _radius = 3.0;

class JhToast2{

    static showText(
        @required String loadingText,
    ){
       _showText(loadingText);
    }
    static showSuccess(
      @required String loadingText,
    ){
      _showSuccess(loadingText);
    }
    static showError(
        @required String loadingText,
        ){
      _showError(loadingText);
    }
    static showInfo(
        @required String loadingText,
        ){
      _showInfo(loadingText);
    }

    static showLoadingText({
      String loadingText = "加载中...",
        }){
      _showLoading(loadingText);
    }

    static hideHUD(){
      dismissAllToast();
    }

}

void _showText(loadingText) {
  var w = Container(
    margin: const EdgeInsets.all(50.0),
    padding: EdgeInsets.symmetric(horizontal: 24.0, vertical: 16.0),
    decoration: BoxDecoration(
        color: _bgColor,
        borderRadius: BorderRadius.circular(_radius)),
    child: ClipRect(
        child:
        Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Text(loadingText,
                style: TextStyle(fontSize: 16,), textAlign: TextAlign.center),
          ],
        )
    ),
  );
  showToastWidget(w);
}


void _showLoading(loadingText) {
  var w = Container(
    margin: const EdgeInsets.all(50.0),
    padding: EdgeInsets.symmetric(horizontal: 24.0, vertical: 16.0),
    decoration: BoxDecoration(
        color: _bgColor,
        borderRadius: BorderRadius.circular(_radius)),
    child: ClipRect(
      child:
        Column(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          Container(
            width: 40.0,
            height: 40.0,
            margin: EdgeInsets.only(bottom: 8.0),
            padding: EdgeInsets.all(4.0),
            child: CircularProgressIndicator(
              strokeWidth: 3.0,
              valueColor:AlwaysStoppedAnimation<Color>(Colors.white),
            ),
          ),
          Text(loadingText,
              style: TextStyle(fontSize: 16,), textAlign: TextAlign.center),
        ],
      )
    ),
  );
  var bg = Container(
    width: 2000,
    height: 2000,
    color: Colors.transparent,
    child: Center(child: w,),
  );


  showToastWidget(bg,duration:Duration(seconds: 10),handleTouch: true);
}

void _showSuccess(loadingText) {
  var w = Container(
    margin: const EdgeInsets.all(50.0),
    padding: EdgeInsets.symmetric(horizontal: 24.0, vertical: 16.0),
    decoration: BoxDecoration(
        color: _bgColor,
        borderRadius: BorderRadius.circular(_radius)),
    child: ClipRect(
        child:
        Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Container(
              width: 40.0,
              height: 40.0,
              margin: EdgeInsets.only(bottom: 8.0),
              padding: EdgeInsets.all(4.0),
              child: Icon(Icons.check_circle_outline, size: 30, color: Colors.white,),
            ),
            Text(loadingText,
                style: TextStyle(fontSize: 16,), textAlign: TextAlign.center),
          ],
        )
    ),
  );
  showToastWidget(w);
}


void _showError(loadingText) {
  var w = Container(
    margin: const EdgeInsets.all(50.0),
    padding: EdgeInsets.symmetric(horizontal: 24.0, vertical: 16.0),
    decoration: BoxDecoration(
        color: _bgColor,
        borderRadius: BorderRadius.circular(_radius)),
    child: ClipRect(
        child:
        Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Container(
              width: 40.0,
              height: 40.0,
              margin: EdgeInsets.only(bottom: 8.0),
              padding: EdgeInsets.all(4.0),
              child: Icon(Icons.highlight_off, size: 30, color: Colors.white,),
            ),
            Text(loadingText,
                style: TextStyle(fontSize: 16,), textAlign: TextAlign.center),
          ],
        )
    ),
  );
  showToastWidget(w);
}

void _showInfo(loadingText) {
  var w = Container(
    margin: const EdgeInsets.all(50.0),
    padding: EdgeInsets.symmetric(horizontal: 24.0, vertical: 16.0),
    decoration: BoxDecoration(
        color: _bgColor,
        borderRadius: BorderRadius.circular(_radius)),
    child: ClipRect(
        child:
        Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Container(
              width: 40.0,
              height: 40.0,
              margin: EdgeInsets.only(bottom: 8.0),
              padding: EdgeInsets.all(4.0),
              child: Icon(Icons.info_outline, size: 30, color: Colors.white,), //info_outline
            ),
            Text(loadingText,
                style: TextStyle(fontSize: 16,), textAlign: TextAlign.center),
          ],
        )
    ),
  );
  showToastWidget(w);
}

###### demo 地址: https://github.com/iotjin/jh_flutter_demo

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Flutter - okToast封装 的相关文章

随机推荐

  • unity中创建询问弹出窗口

    在开发过程中进程会遇到需要弹出一个窗口询问用户是否进行的操作 今天就来制作一个这样弹出窗口 然后根据弹出窗口的选择内容不同进行不同的操作 本例中主要是为了删除一个数据 而在删除数据操作前需要得到用户的一个确认操作 这里面主要用到了Notif
  • 一个超级棒的VUE流程设计器--easy-flow开箱即用

    今天小编推荐一款流程设计器easy flow easy flow基于VUE ElementUI JsPlumb的流程设计器 通过 vuedraggable 插件来实现节点拖拽 功能介绍 支持拖拽添加节点 点击线进行设置条件 支持给定数据加载
  • JSON介绍及代码示例

    了解json JSON是什么 JSON是JavaScript Object Notation的缩写 它是一种数据交换格式 在JSON出现之前 大家一直用XML来传递数据 因为XML是一种纯文本格式 所以它适合在网络上交换数据 XML本身不算
  • MFC ListControl

    1 ListControl的基本创建 基本设置 m ListCtrl DeleteAllItems m ListCtrl InsertColumn 0 T NBA m ListCtrl InsertColumn 1 T Final Cham
  • office2010 卸载出现“安装程序找不到ProPlus.ww\ProPsWW.cab 请浏览正确的安装源的错”解决方法

    笔者在换电脑后想卸载office2010安装office2016 但是卸载的过程中遇到了上述问题就记录一下自己的解决方案 1 强制删除officeX对应的文件夹 然后使用toolkit工具清理即可 笔者是通过这种方法解决的 2 应该也可以使
  • C++STL之deque容器

    概述 上一篇我们讲过queue容器 它是一个单向的队列 只能从尾部插入 头部删除 而本节讲的deque容器 它是一个双向的队列 在头尾均可以调用插入与删除 并且支持迭代器和迭代器随机访问 这是它与queue的最大区别 实际上 deque容器
  • c++读取文件

    include
  • 7z命令行加密文件夹和文件名

    因为有时候需要将非常机密的东西上传到网盘 毕竟网盘也不一定安全 而每次都鼠标点添加密码很麻烦 然后就用命令行脚本弄快 电脑安装7zip 在你要压缩的文件夹打开命令行 7z a r pABC12345 mhe on test 7z a 添加f
  • 5 款最棒的 Vue 移动端 UI 组件库 - 特别针对国内使用场景推荐

    本文完整版 最棒的 Vue 移动端 UI 组件库 特别针对国内使用场景推荐 Vue 移动端 UI 组件库推荐 Vant 3 有赞移动 UI 组件库 支持 Vue 3 微信小程序 支付宝小程序 Cube UI 滴滴出行移动端 UI 库 质量可
  • 关于直流电源纹波和噪声的测量的分析和介绍

    电源纹波和噪声的定义PARD periodicand random deviation 1 电源纹波 Power Ripple 直流电压 电流中 叠加在直流稳定量上的交流分量 用电压和电流的均方根值 mVrms mArms 或峰峰值 mVp
  • 优秀LOGO的六大特质

    1 识别性 大多数的设计师认为 识别性是最容易在艺术设计和商业设计上发生冲突的地方 很多设计师都抱怨客户没有审美 喜欢平庸的LOGO设计 而一些客户认为设计师缺乏对公司和产品的理解 不懂营销 归根到底 无论设计师的设计多么创新 多么独特 始
  • 【word】错误!文档中没有指定样式的文字。 1

    问题 给文档中的图片插入题注时 报错 错误 文档中没有指定样式的文字 1 解决办法 光标定位到错误信息上 单击右键 选择 编辑域 在弹出的 域 对话框中 左侧的 域名 列表中选择 StyleRef 在右侧的 样式名 列表中选择 列表段落
  • Fabric private data入门实战

    Hyperledger Fabric private data是1 2版本引入的新特性 fabric private data是利用旁支数据库 SideDB 来保存若干个通道成员之间的私有数据 从而在通道之上又提供了一层更灵活的数据保护机制
  • VSCode中配置命令行参数

    VSCode中配置命令行参数 在跑程序调试的时候 可以直接使用脚本运行程序 这个时候调试代码只能用pdb 我觉得不太习惯 而且感觉不是很好 所以想这能不能将运行程序的脚本中的命令直接配置到vscode上 就有了这篇记录 正常vscode D
  • DHCP配置实战

    1 DHCP简介 DHCP dynamic host configuration protocol 动态的主机配置协议 基于TCP P的网络 DHCP减少了重新配置计算机IP地址的工作量 在TCP P网络中 IP地址的规划与分配是一件重要而
  • Java手写广度优先搜索和案例拓展

    Java手写广度优先搜索和案例拓展 手写必要性 手写实现广度优先搜索算法主要有以下几个必要性 理解算法原理 通过手写实现广度优先搜索算法 能够深入理解算法的原理和运行机制 这有助于我们更好地理解广度优先搜索的核心思想和优势 并能应用于解决其
  • pa皮安级电流检测电路

    1 芯片 ad8602 lmc6062 2 电路
  • Eclipse中targetlm2e-wtplweb-resources\META-1(Click for details)解决办法

    targetlm2e wtplweb resources META 1 Click for details 系统找不到指定的路径 解决办法 最近总是发现我的eclipse里面的maven项目总是报错误时不时地出现 然后我自己更新一下mave
  • Qt学习(三)—— lambda表达式

    lambda表达式 lambda 表达式是 C 11 新增的新特性 用于定义并创建匿名的函数对象 在 Qt 中配合信号一起使用 使用lambda表达式的好处在于不用定义槽函数 也不用指定信号接收者 为了使用 lambda 表达式 需要在项目
  • Flutter - okToast封装

    demo 地址 https github com iotjin jh flutter demo 使用版本 加载框 https pub flutter io cn packages oktoast readme tab oktoast 2 3