Flutter EasyLoading – 让全局Toast/Loading更简单

最新推荐文章于 2025-03-11 19:35:12 发布

ZH洺

最新推荐文章于 2025-03-11 19:35:12 发布

阅读量1.2k

点赞数 18

文章标签： flutter

本文链接：https://blog.youkuaiyun.com/weixin_32619013/article/details/136130659

版权

本文介绍了Flutter插件Flutter EasyLoading，它提供23种加载动画、进度条和Toast展示，且纯Flutter实现，兼容iOS和Android。文章详细讲解了如何使用和实现该插件，包括Overlay和OverlayEntry在全局弹窗中的应用，以及自定义圆形进度条的绘制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

flutter_easyloading: 一个简单易用的Flutter插件，包含23种loading动画效果、进度条展示、Toast展示。纯Flutter端实现，支持iOS、Android。

开源地址：https://github.com/huangjiank…

前言

Flutter是Google在2017年推出的一套开源跨平台UI框架，可以快速地在iOS、Android和Web平台上构建高质量的原生用户界面。Flutter发布至今，不可谓不说是大受追捧，吸引了大批App原生开发者、Web开发者前赴后继的投入其怀抱，也正由于Flutter是跨平台领域的新星，总的来说，其生态目前还不是十分完善，我相信对于习惯了原生开发的同学们来说，找轮子肯定没有了那种章手就莱的感觉。比如说这篇文章即将讲到的，如何在Flutter应用内简单、方便的展示Toast或者Loading框呢？

探索

起初，我也在pub上找到了几个比较优秀的插件：

FlutterToast: 这个插件应该是很多刚入坑Flutter的同学们都使用过的，它依赖于原生，但对于UI层级的问题，最好在Flutter端解决，这样便于后期维护，也可以减少兼容性问题；
flutter_oktoast: 纯Flutter端实现，调用方便。但缺少loading、进度条展示，仍可自定义实现；

试用过后，发现这些插件都或多或少不能满足我们的产品需求，于是便结合自己产品的需求来造了这么个轮子，也希望可以帮到有需要的同学们。效果预览：

实现

showDialog 实现

先看看初期我们实现弹窗的方式showDialog，部分源码如下：

Future<T> showDialog<T>({
  @required BuildContext context,
  bool barrierDismissible = true,
  @Deprecated(
    'Instead of using the "child" argument, return the child from a closure '
    'provided to the "builder" argument. This will ensure that the BuildContext '
    'is appropriate for widgets built in the dialog. '
    'This feature was deprecated after v0.2.3.'
  )
  Widget child,
  WidgetBuilder builder,
  bool useRootNavigator = true,
})

这里有个必传参数context，想必接触过Flutter开发一段时间的同学，都会对BuildContext有所了解。简单来说BuildContext就是构建Widget中的应用上下文，是Flutter的重要组成部分。Buil