短视频平台搭建,收到通知后弹出相关提示的弹窗
短视频平台搭建,收到通知后弹出相关提示的弹窗实现的相关代码
一.Flutter toast库配置,可参考fluttertoast配置引用
1.在pubspec.yaml中配置fluttertoast库,通过Pub get 获取fluttertoast的版本,通过Pub upgrade更新,eg:
1 | <br> # The following adds the Cupertino Icons font to your application.<br> # Use with the CupertinoIcons class for iOS style icons.<br> cupertino_icons: ^1.0.2<br> provider: ^5.0.0<br> fluttertoast: ^8.0.8 |
2.在需要显示toast的dart文件中,import fluttertoast.dart,eg:
1 | <br>import 'package:fluttertoast/fluttertoast.dart' ; |
3.fluttertoast.dart源码查看
1 | <br> /// Summons the platform's showToast which will display the message<br> ///<br> /// Wraps the platform's native Toast for android.<br> /// Wraps the Plugin https://github.com/scalessec/Toast for iOS<br> /// Wraps the https://github.com/apvarun/toastify-js for Web<br> ///<br> /// Parameter [msg] is required and all remaining are optional<br> static Future<bool?> showToast({<br> required String msg,<br> Toast? toastLength,<br> int timeInSecForIosWeb = 1,<br> double? fontSize,<br> ToastGravity? gravity,<br> Color? backgroundColor,<br> Color? textColor,<br> bool webShowClose = false,<br> webBgColor: "linear-gradient(to right, #00b09b, #96c93d)",<br> webPosition: "right",<br> }) async {<br> String toast = "short";<br> if (toastLength == Toast.LENGTH_LONG) {<br> toast = "long";<br> }<br> <br> String gravityToast = "bottom";<br> if (gravity == ToastGravity.TOP) {<br> gravityToast = "top";<br> } else if (gravity == ToastGravity.CENTER) {<br> gravityToast = "center";<br> } else {<br> gravityToast = "bottom";<br> }<br> <br>//lines from 78 to 97 have been changed in order to solve issue #328<br> if (backgroundColor == null) {<br> backgroundColor = Colors.black;<br> }<br> if (textColor == null) {<br> textColor = Colors.white;<br> }<br> final Map<String, dynamic> params = <String, dynamic>{<br> 'msg': msg,<br> 'length': toast,<br> 'time': timeInSecForIosWeb,<br> 'gravity': gravityToast,<br> 'bgcolor': backgroundColor != null ? backgroundColor.value : null,<br> 'iosBgcolor': backgroundColor != null ? backgroundColor.value : null,<br> 'textcolor': textColor != null ? textColor.value : null,<br> 'iosTextcolor': textColor != null ? textColor.value : null,<br> 'fontSize': fontSize,<br> 'webShowClose': webShowClose,<br> 'webBgColor': webBgColor,<br> 'webPosition': webPosition<br> };<br> <br> bool? res = await _channel.invokeMethod('showToast', params);<br> return res;<br> }<br>} |
二.自定义fluttertoast
1.定义FToast字段,eg:
1 | <br>FToast fToast; |
2.初始化定义的FToast,eg:
1 | <br> @override<br> void initState() {<br> // TODO: implement initState<br> super.initState();<br> fToast=FToast();<br> fToast.init(context);<br> } |
3.定义FToast显示的方法,包括内容,布局,和显示时长,eg:
1 | <br>_showToast() {<br> Widget toast = Container(<br> padding: const EdgeInsets.symmetric(horizontal: 5.0, vertical: 5.0),<br> alignment: Alignment.center,<br> child: Row(<br> mainAxisSize: MainAxisSize.min,<br> children: const [<br> SizedBox(<br> width: 50.0,<br> ),<br> Text(<br> "Dividend cannot be zero" ,<br> textAlign: TextAlign.center,<br> overflow: TextOverflow.ellipsis,<br> style: TextStyle(<br> color: Colors.black,<br> backgroundColor: Colors.white,<br> fontSize: 18,<br> ),<br> )<br> ],<br> ),<br> );<br> <br> <br> fToast.showToast(<br> child: toast,<br> gravity: ToastGravity.BOTTOM,<br> toastDuration: const Duration(seconds: 1),<br> );<br> <br> // Custom Toast Position<br> fToast.showToast(<br> child: toast,<br> toastDuration: const Duration(seconds: 3),<br> positionedToastBuilder: (context, child) {<br> return Positioned(<br> child: child,<br> top: 15.0,<br> left: 15.0,<br> );<br> });<br> } |
以上就是短视频平台搭建,收到通知后弹出相关提示的弹窗实现的相关代码, 更多内容欢迎关注之后的文章
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现