【Flutter】Flutter 使用 fluttertoast 实现显示 Toast 消息
【Flutter】Flutter 使用 fluttertoast 实现显示 Toast 消息
文章目录
- 一、前言
- 二、安装和基础使用
- 三、不同平台的支持情况
- 四、如何自定义 Toast
- 五、在实际业务中的应用
- 六、完整的业务代码示例(基于 Web 端)
- 七、总结
一、前言
在这篇文章中,我将与你分享如何在 Flutter 项目中使用 fluttertoast
包来显示 Toast 消息。
Toast 是一个简短的、非模态的消息提示框,它可以在应用的前端显示,不会打断用户的操作。fluttertoast
是一个非常受欢迎的 Flutter 包,用于在 Flutter 项目中轻松创建 Toast 消息。
本文的重点:
fluttertoast
包的基础使用方法- 如何自定义 Toast 的样式和内容
- 在实际业务中如何使用
fluttertoast
- 一个基于 Web 端的完整 Flutter 项目示例
版本信息:
- Flutter 版本:3.10
- Dart 版本:3.0
- fluttertoast 包版本:8.2.2
你是否对成为 Flutter 高手充满渴望,想要掌握更多前沿技巧和最佳实践?现在,你的机会来了!
🚀 Flutter 从零到一:基础入门到应用上线全攻略 正在热烈招募参与者!
✅ 这个专栏不仅包括了全面的 Flutter 学习资源,还有实用的代码示例和深入的解析教程。
✅ 专栏内容会持续更新,价格也会随之上涨。现在加入,享受最优惠的价格,抓住属于你的机会!
✅ 想要与其他 Flutter 学习者互动交流吗?点击这里 加入我们的讨论群,一起成长、一起进步。
别再等待,让我们今天就启程,共同开启 Flutter 的精彩学习之旅吧!
二、安装和基础使用
首先,我们需要在项目中添加 fluttertoast
的依赖。打开你的 pubspec.yaml
文件,然后在 dependencies
下添加以下代码:
fluttertoast: ^8.2.2
然后,运行 flutter pub get
命令来安装新的依赖。
接下来,我们可以开始使用 fluttertoast
了。首先,确保你已经导入了这个包:
import 'package:fluttertoast/fluttertoast.dart';
现在,你可以使用以下代码来显示一个基础的 Toast 消息:
Fluttertoast.showToast(msg: "这是一个 Toast 消息",toastLength: Toast.LENGTH_SHORT,gravity: ToastGravity.CENTER,timeInSecForIosWeb: 1,backgroundColor: Colors.red,textColor: Colors.white,fontSize: 16.0
);
三、不同平台的支持情况
fluttertoast
支持 Android、iOS 和 Web 三个平台。但是,根据平台的不同,Toast 的显示方式和特性也有所不同。
- Android 和 iOS:这两个平台上的 Toast 支持不需要 BuildContext 和需要 BuildContext 两种方式。不需要 BuildContext 的方式有限的 UI 控制,而需要 BuildContext 的方式则提供了完全的 UI 控制。
- Web:Web 平台上的 Toast 使用了 Toastify-JS,因此它的特性和 Android、iOS 上的 Toast 有所不同。例如,Web 上的 Toast 只支持顶部和底部的显示位置。
这是小雨青年于 2023 年发布在 CSDN 的博客,由于目前采集站侵权行为猖獗,如果你不是在 CSDN 看到本文,麻烦你通过 CSDN 联系我,谢谢你的支持。
四、如何自定义 Toast
在 Flutter 中,我们有很多方式可以自定义 Toast 的样式和内容。fluttertoast
包也提供了丰富的参数供我们使用。
- 自定义文本和背景颜色
你可以通过backgroundColor
和textColor
参数来自定义 Toast 的背景颜色和文本颜色。
Fluttertoast.showToast(msg: "自定义背景和文本颜色",backgroundColor: Colors.blue,textColor: Colors.yellow,
);
- 自定义显示位置
通过gravity
参数,你可以控制 Toast 出现在屏幕的哪个位置。
Fluttertoast.showToast(msg: "我在屏幕顶部",gravity: ToastGravity.TOP,
);
- 自定义显示时间
使用timeInSecForIosWeb
参数,你可以设置 Toast 在屏幕上停留的时间。
Fluttertoast.showToast(msg: "我会停留 3 秒",timeInSecForIosWeb: 3,
);
五、在实际业务中的应用
Toast 在实际业务中有很多用途,比如用于显示操作成功或失败的提示、网络请求的状态等。
- 操作反馈
当用户完成某个操作(如提交表单、删除条目等)后,你可以使用 Toast 来给出即时的反馈。
Fluttertoast.showToast(msg: "删除成功!",backgroundColor: Colors.green,textColor: Colors.white,
);
- 网络请求状态
在进行网络请求时,你可以使用 Toast 来显示请求的状态,如“加载中”、“请求成功”或“请求失败”。
// 请求开始
Fluttertoast.showToast(msg: "加载中...",backgroundColor: Colors.blue,
);// 请求成功
Fluttertoast.showToast(msg: "请求成功!",backgroundColor: Colors.green,
);// 请求失败
Fluttertoast.showToast(msg: "请求失败,请重试!",backgroundColor: Colors.red,
);
六、完整的业务代码示例(基于 Web 端)
在这一节中,我将给出一个基于 Web 端的完整 Flutter 项目示例,展示如何在实际业务中使用 fluttertoast
。
首先,确保你的 Flutter 项目支持 Web 端。然后,按照第二节的步骤添加 fluttertoast
包的依赖。
接下来,我们创建一个简单的 Web 应用,其中包含一个按钮。点击这个按钮时,会显示一个 Toast 消息。
import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';void main() {runApp(MyApp());
}class MyApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(home: Scaffold(appBar: AppBar(title: Text('Flutter Toast Web 示例')),body: Center(child: ElevatedButton(onPressed: () {Fluttertoast.showToast(msg: "你点击了按钮!",toastLength: Toast.LENGTH_SHORT,gravity: ToastGravity.CENTER,timeInSecForIosWeb: 1,backgroundColor: Colors.red,textColor: Colors.white,fontSize: 16.0,);},child: Text('点击我'),),),),);}
}
运行这个 Web 应用,点击按钮,你就会看到一个 Toast 消息出现在屏幕中央。
七、总结
经过上面的介绍,我相信你已经对 fluttertoast
包有了深入的了解。Toast 是一个非常实用的 UI 元素,它可以为用户提供及时的反馈,增强应用的交互性。fluttertoast
包为 Flutter 开发者提供了一个简单而强大的工具,使我们能够轻松地在应用中添加 Toast 消息。
回顾一下我们学到的内容:
- 如何在 Flutter 项目中安装和使用
fluttertoast
包。 - 如何自定义 Toast 的样式和内容。
- 在实际业务中如何使用 Toast 提供反馈。
- 一个基于 Web 端的完整 Flutter 项目示例。
对 Flutter 感兴趣,渴望深入探索和学习吗?Flutter 从零到一:基础入门到应用上线全攻略 正是你的完美起点!
📘 在这个专栏中,你将发现丰富的 Flutter 学习资源,从代码示例到深入的技术解读,一应俱全。
🛠️ 想要了解如何用 Flutter 构建出色的应用吗?所有的秘诀和答案都在我们的专栏里等着你!
💰 别再犹豫,专栏内容将不断更新,价格也将逐渐上涨。现在就加入,享受最优惠的价格,开启你的 Flutter 探索之旅!
想了解更多?点击这里查看 Flutter Developer 101:入门小册 & 专栏指引。
👥 还有,别忘了点击这里 加入我们的讨论群,与其他 Flutter 爱好者一起交流和学习,共同成长!
相关文章:
【Flutter】Flutter 使用 fluttertoast 实现显示 Toast 消息
【Flutter】Flutter 使用 fluttertoast 实现显示 Toast 消息 文章目录 一、前言二、安装和基础使用三、不同平台的支持情况四、如何自定义 Toast五、在实际业务中的应用六、完整的业务代码示例(基于 Web 端)七、总结 一、前言 在这篇文章中,…...
nowcoder NC236题 最大差值
目录 题目描述: 示例1 示例2 题干解析: 暴力求解: 代码展示: 优化: 代码展示: 题目跳转https://www.nowcoder.com/practice/a01abbdc52ba4d5f8777fb5dae91b204?tpId128&tqId33768&ru/exa…...
TCP/IP五层模型、封装和分用
1.网络通信基础2.协议分层OSI七层协议模型TCP/IP五层/四层协议模型【重点】 3. 封装&分用 1.网络通信基础 IP地址:表示计算机的位置,分源IP和目标IP;举个例子:买快递,商家从上海发货,上海就是源IP&…...
LeetCode 面试题 01.08. 零矩阵
文章目录 一、题目二、C# 题解 一、题目 编写一种算法,若M N矩阵中某个元素为0,则将其所在的行与列清零。 点击此处跳转题目。 示例 1: 输入: [ [1,1,1], [1,0,1], [1,1,1] ] 输出: [ [1,0,1], [0,0,0], [1,0,1] ] 示…...
Qt应用开发(基础篇)——进度条 QProgressBar
一、前言 QProgressBar类继承于QWidget,是一个提供了横向或者纵向进度条的小部件。 QProgressBar进度条一般用来显示用户某操作的进度,比如烧录、导入、导出、下发、上传、加载等这些需要耗时和分包的概念,让用户知道程序还在正常的执行中。 …...
108页石油石化5G智慧炼化厂整体方案PPT
导读:原文《108页石油石化5G智慧炼化厂整体方案PPT》(获取来源见文尾),本文精选其中精华及架构部分,逻辑清晰、内容完整,为快速形成售前方案提供参考。以下是部分内容,...
Codeforces 1625E2 括号树 + BIT
题意 传送门 Codeforces 1625E2 Cats on the Upgrade (hard version) 题解 首先利用栈将原始字符串转换为合法的 RBS,不能匹配的括号设为 ‘.’。根据匹配的括号序列构造树,具体而言,遇到左括号,则新建节点向下递归,…...
PHP命令行CLI的使用
PHP命令行界面 PHP命令行界面(CLI)是一种使用命令行(终端)来运行PHP脚本的方式,与在Web服务器环境下运行PHP不同。CLI提供了一种与操作系统交互的方式,能够在命令行中直接执行PHP代码。 以下是一些与PHP命…...
近期嵌软线下笔试题记录
1、以下代码的输出结果是? #include <stdio.h> #include <string.h>int main() {int a,b,c,d;a 10;b a; //a先赋值给b,然后自增1c a; //a自增1后赋值给cd 10*a; //先进行运算然后a自增1printf("b,c,d:%d…...
基于MYSQL的主从同步和读写分离
目录 一.完成MySQL主从同步(一主两从) 1.主库配置 2.建立同步账号 3.锁表设置只读 4.备份数据库数据 5.主库备份数据上传到从库 6.从库上还原备份 7.解锁 8.从库上设定主从同步 9.启动从库同步开关 10.检查状态 二.基于MySQL一主两从配置&…...
java八股文面试[多线程]——合适的线程数是多少
知识来源: 【并发与线程】 合适的线程数量是多少?CPU 核心数和线程数的关系?_哔哩哔哩_bilibili 【2023年面试】程序开多少线程合适_哔哩哔哩_bilibili...
Linux系统下vim常用命令
一、基础命令: v:可视模式 i:插入模式 esc:命令模式下 :q :退出 :wq :保存并退出 ZZ:保存并退出 :q! :不保存并强制退出二、在Esc下: dd : 删除当前行 yy:复制当前行 p:复制已粘贴的文本 u:撤销上一步 U:…...
【2023】LeetCode HOT 100——链表
目录 1. 相交链表1.1 C++实现1.2 Python实现1.3 时空分析2. 反转链表2.1 C++实现2.2 Python实现2.3 时空分析3. 回文链表3.1 C++实现3.2 Python实现3.3 时空分析4. 环形链表4.1 C++实现4.2 Python实现4.3 时空分析5. 环形链表 II5.1 C++实现5.2 Python实现...
智能井盖传感器,物联网智能井盖系统
随着城市人口的不断增加和城市化进程的不断推进,城市基础设施的安全和可靠性变得愈发重要,城市窨井盖作为城市基础设施重要组成部分之一,其安全性事关城市安全有序运行和居民生产生活安全保障。 近年来,各地都在加强城市窨井盖治理…...
C语言三子棋解析
目录(标2的是我自己写的一堆问题不知道怎么改) 开始菜单1打印棋盘1玩家下棋1电脑下棋1判断输赢1开始菜单2打印棋盘2选择先后2玩家下棋2电脑下棋2判断输赢2完整代码文件else.h文件else.c文件test.c 开始菜单1 void menu()//打印菜单 {printf("*****…...
【Jenkins打包服务,Dockerfile报错:manifest for java : 8 not fourd】
1、问题描述 Jenkins打包服务运行dockerfile里的FROM java:8报错manifest for java : 8 not fourd Caused by: com.spotify. docker.client.exceptions.DockerException: manifest for java:8 not found2、解决方法 在网上查找许多方法后得出这是由于Docker官方已经弃用java…...
读SQL学习指南(第3版)笔记06_连接和集合
1. 连接 1.1. 笛卡儿积 1.1.1. 交叉连接(cross join) 1.1.2. 查询并没有指定两个数据表应该如何连接,数据库服务器就生成了笛卡儿积 1.1.2.1. 两个数据表的所有排列组合 1.1.3. 很少会用到(至少不会特意用到) 1.…...
C#学习,结构,面向对象,类
结构和类 结构是从过程化程序设计中保留下来的一种数据类型,类则是面向对象程序设计中最基本的、也是最重要的概念。 结构 结构是一种值类型,通常用来封装一组相关的变量,结构中可以包含构造函数、变量、字段、方法、属性、运算符、事件和…...
【PHP】文件操作
文章目录 文件编程的必要性目录操作其它目录操作递归遍历目录PHP5常见文件操作函数PHP4常见文件操作函数其他文件操作函数 文件编程的必要性 文件编程指利用PHP代码针对文件(文件夹)进行增删改查操作。 在实际开发项目中,会有很多内容&…...
科创板50ETF期权交易:详细规则、费用、保证金和开户攻略
科创板50ETF期权是指以科创板50ETF为标的资产的期权合约。科创板50ETF是由交易所推出的一种交易型开放式指数基金(ETF),旨在跟踪科创板50指数的表现,下文介绍科创板50ETF期权交易:详细规则、费用、保证金和开户攻略&am…...
怎么把图片放大并且清晰?有详细的方法步骤
怎么把图片放大并且清晰?数字图像处理中的图片放大是许多行业和领域中广泛应用的一项技术。常规的放大方法通过插值或复制像素的方式增加像素数,但这会导致失真和模糊。无损放大是一种特殊的放大方法,它可以通过数学算法来增加图片的尺寸&…...
C++ 构造函数、析构函数调用虚函数
C虚函数是通过虚表实现的,虚函数的地址记录在需表中,只对象完成构造完成后,虚函数的地址才最终确定。 构造函数中调用虚函数 基类先于派生类构造,所以构造时没法调用到派生类的虚函数,也就是说只能调用到自己&#x…...
工业状态监测如何选择合适的无线技术?
工业领域的状态监测在提高生产效率和产品质量方面起着关键作用。过去依赖于预防性维护和例行检查的方式已经不再能满足日益复杂的生产需求,随着工业物联网(IIoT)的兴起,设备状态监测逐渐成为一种关键策略,催生了预测性…...
Mysql45讲学习笔记
前言:这篇文章主要总结事务,锁、索引的一些知识点,然后分享一下自己学习小心得,我会从点到线在到面展开说说,对于学习任何知识,我们都应该藐其全貌,不要一开始就选入细节 基础 一、基础架构&a…...
Neither the JAVA_HOME nor the JRE_HOME environment variable is defined
报错描述 情景一 1Panel在"主机-->进程守护"通过命令"nohup /opt/tomcat/bin/startup.sh > /opt/supersivor/tomcat/nohup.log &"创建守护进程,运行日志如下: #--------------------------------------------------------…...
opencv 水果识别+UI界面识别系统,可训练自定义的水果数据集
目录 一、实现和完整UI视频效果展示 主界面: 测试图片结果界面: 自定义图片结果界面: 二、原理介绍: 图像预处理 HOG特征提取算法 数据准备 SVM支持向量机算法 预测和评估 完整演示视频: 完整代码链接 一、…...
TypeScript数组和对象的操作
TypeScript数组和对象的操作 一、数组的声明二、数组初始化三、数组元素赋值、添加、更改四、删除五、合并、断开数组六、查找数组元素七、连接数组元素八、排序、反序数组九、遍历数组,对象 一、数组的声明 let arr1: Array<number>; let arr2: number[];二…...
docker之Compose与DockerSwarm
目录 Compose 简介 概念 为什么需要? 配置字段 常用命令 安装 1.下载 2.授权 使用 1.创建文件 2.启动 docker Swarm 关键概念 调度策略 spread binpack random 特性 集群部署 1.准备 2.创建swarm并添加节点 在主服务器上创建swarm集群 节点…...
VS Code 使用 clang++ 编译,使用 cppvsdbg 或 lldb 调试的配置方法
需要安装的 VS Code LLVM VS Code 需要安装的插件: C/C(用来配置 c_cpp_properties.json) CodeLLDB(如果你要用 lldb 调试,那么这个插件就需要安装,用来连接到 lldb 调试器) 流程 我们都…...
android11,12 Launcher3编译什么
1首先看看手机里的是什么 adb shell pm path com.android.launcher3 package:/system_ext/priv-app/Launcher3QuickStep/Launcher3QuickStep.apk 然后就编译Launcher3QuickStep 2push apk 没什么说的,push到对应的文件夹 /system_ext/priv-app/Launcher3Quick…...
Go 第三方库引起的线上问题、如何在线线上环境进行调试定位问题以及golang开发中各种问题精华整理总结
Go 第三方库引起的线上问题、如何在线线上环境进行调试定位问题以及golang开发中各种问题精华整理总结。 01 前言 在使用 Go 语言进行 Web 开发时,我们往往会选择一些优秀的库来简化 HTTP 请求的处理。其中,go-resty 是一个被广泛使用的 HTTP 客户端。…...
【C语言】#define 宏定义初步使用
使用宏定义可以防止出错,提高可移植性,可读性,方便性等。 下面列举了一些成熟软件中常用的宏定义。 重新定义一些基本类型 重新定义一些类型,防止由于各种平台和编译器的不同,而产生的类型字节数差异,方便…...
项目里面怎么解决跨域的?
一.前端配置跨域 proxy解决跨域 在vue.config.js中通过proxy devServer中配置反向代理。 devServer: {port: port,open: true,overlay: {warnings: false,errors: true},// 配置反向代理proxy: {// 当地址中有/api的时候会触发代理机制/api: {target: http://ihrm-java.ithe…...
Oracle 批量导出表注释和主键
–查询分表(目前分了16张表) –先查询注释为空的表,也就是11表做示例,统计出来以后11批量修改成1 select owner,column_name,comments,table_name from all_col_comments a where a.table_name like ‘TB%1’ and a.comments is n…...
Linux C++ 海康摄像头获取过车信息
代码 void CALLBACK MessageCallback(LONG lCommand, NET_DVR_ALARMER *pAlarmer, char *pAlarmInfo, DWORD dwBufLen, void *pUser) {printf("enter MessageCallback---------------------->\n");int i;NET_DVR_ALARMINFO_V30 struAlarmInfo;memcpy(&struAl…...
iOS逆向:越狱及相关概念的介绍
在上一篇内容中我们介绍了App脱壳的技术,今天我们来介绍一个和iOS逆向密切相关的知识:越狱。 iOS操作系统的封闭性一直是开发者们关注的焦点之一。为了突破Apple的限制,越狱技术应运而生。本文将深入探讨iOS越狱,包括可越狱的版本…...
SQL语法与DDL语句的使用
文章目录 前言一、SQL通用语法二、DDL语句1、DDL功能介绍2、DDL语句对数据库操作(1)查询所有数据库(2)查询当前数据库(3)创建数据库(4)删除数据库(5)切换数据…...
Node.js /webpack DAY6
一、Node.js 入门 1. 什么是 Node.js? 2. 什么是前端工程化? 3. Node.js 为何能执行 JS? 4. Node.js 安装 5. 使用 Node.js 总结 6. fs 模块 - 读写文件 /*** 目标:基于 fs 模块 读写文件内容* 1. 加载 fs 模块对象* 2. 写入文件…...
Java:SpringBoot使用AES对JSON数据加密和解密
目录 1、加密解密原理2、项目示例2.1、项目结构2.2、常规业务代码2.3、加密的实现 2.4、接口测试2.5、总结 1、加密解密原理 客户端和服务端都可以加密和解密,使用base64进行网络传输 加密方 字符串 -> AES加密 -> base64解密方 base64 -> AES解密 -&g…...
【PHP】Swoole:一款强大的PHP网络编程工具
在科学计算领域,Swoole是一款功能强大的PHP扩展,它提供了高性能的网络通信和异步编程功能。Swoole不仅支持TCP、UDP、Unix Socket和HTTP等通信协议,还具有异步并发处理能力,使得PHP开发者能够轻松地构建高性能的网络应用程序。 1…...
【C语言】每日一题(除自身以外数组的乘积)
添加链接描述,链接奉上 方法: 暴力循环:前缀积后缀积(分组): 暴力循环: 暴力循换真的是差生法宝,简单好懂,就是不实用,大多数的题目都会超过时间限制(无奈) 思路&…...
C语言每日一练-----Day(4)
本专栏为c语言练习专栏,适合刚刚学完c语言的初学者。本专栏每天会不定时更新,通过每天练习,进一步对c语言的重难点知识进行更深入的学习。 今日练习题关键字:记负均正 旋转数组的最小数字 二分查找 💓博主…...
如何使用工具将批量查询的物流信息导出到表格
现如今,物流行业发展迅速,人们对于物流信息的查询需求也越来越高。为了满足用户的需求,我们推荐一款便捷高效的物流信息查询工具——"固乔快递查询助手"软件。 首先,用户需要下载并安装"固乔快递查询助手"软件…...
Haproxy+Keepalive 整合rabbitmq实现高可用负载均衡
Haproxy 实现负载均衡 HAProxy 提供高可用性、负载均衡及基于 TCPHTTP 应用的代理,支持虚拟主机,它是免费、快速并且可靠的一种解决方案,包括 Twitter,Reddit,StackOverflow,GitHub 在内的多家知名互联网公司在使用。HAProxy 实现了一种…...
电子病历系统的核心技术——电子病历编辑器
一体化电子病历系统基于云端SaaS服务的方式,采用B/S(Browser/Server)架构提供,覆盖了医疗机构电子病历模板制作到管理使用的整个流程。除实现在线制作内容丰富、图文并茂、功能完善的电子病历模板外,还可按照医疗机构的…...
C++------map和set的使用
文章目录 关联式容器键值对树型结构的关联式容器set的介绍map的介绍 关联式容器 什么是关联式容器?它与序列式容器有什么区别? 关联式容器也是用来存储数据的,与序列式容器不同的是,其里面存储的是<key,value>结…...
URI和URL和URN区别
URI、URL 和 URN 是一系列从不同角度来看待资源标识和定位的概念。虽然它们有一些重叠,但每个概念都强调了不同的方面。 URI(Uniform Resource Identifier):URI 是一个通用的术语,用于标识和定位资源。它是一个抽象的概…...
【Unity学习笔记】DOTween(1)基础介绍
本文中大部分内容学习来自DOTween官方文档 文章目录 什么是DOTween?DOSetOnTweenerSequenceTweenNested tween 初始化使用方式 什么是DOTween? DOTween是一个动画插件,Tween是补间的意思。这个插件以下简称DOT,DOT很方便使用&…...
springboot项目,使用JNA框架调用C++库无法捕获异常的解决思路
写在前面:这个东西真的坑,工作上遇到的和JNA项目的入门案例差别就像是二重积分与小学数学之间的差距,折磨! 使用 JNA(Java Native Access)框架调用 C 库时,如果出现问题导致进程直接结束而无法捕…...
【项目 计网7】4.20 多进程实现并发服务器 4.22 多线程实现并发服务器
文章目录 4.20 多进程实现并发服务器server_process.cclient.c4.22 多线程实现并发服务器客户端代码:服务端代码: 4.20 多进程实现并发服务器 要实现TCP通信服务器处理并发的任务,使用多线程或者多进程来解决。 思路: 1、一个父进…...