由你做主，FLoading
2020-08-03 本文已影响0人
CoorChice
image
FWidget 用心提供精致的组件，助您构建精美的应用。
image
今天，FWidget 为开发者们带来的精致组件是～FLoading。
在实际应用场景中，构建 Loading 元素似乎是每个开发者必须掌握的技能。现在，FLoading 来帮助开发者们进一步精进这以技能。
FLoading 提供了一种极简的 Loading 元素构建方式，同时为开发者提供了诸多可高度定制化的配置，让开发者可以轻松的创建出精美的 Loading。
✨ 特性
那么，来看看 FLoading 都带来了什么。
-
提供最便捷的方式，控制 Loading 的 展示/隐藏
-
支持修改背景颜色
-
支持定时自动隐藏
-
支持局部和全局自定义样式
image
🛸 传送区
🛸 【传送门：FLoading Github 主页】
📖 【传送门：FLoading 文档】
🌈 显示/隐藏
image
/// 显示
///
/// show
FLoading.show(context);
/// 隐藏
///
/// hide
FLoading.hide();
通过 FLoading 来实现 Loading 的 显示/隐藏 ，真是太简单了。
💎 自定义样式
image
FLoading 允许开发者自由的定义全局 Loading 样式或单次展示的 Loading 样式。
自定义全局样式
/// 定义全局 Loading 样式
///
///Define global loading style
FLoading.init(CupertinoActivityIndicator(), backgroundColor: Colors.black38);
/// 显示
///
/// show
FLoading.show(context);
在自定义全局样式后，开发者就可以便捷的通过 FLoading.show(context);，即可在全局任意位置构建统一的 Loading 样式。
自定义单次样式
FLoading.show(context,
/// 通过 loading 配置单次样式
///
/// One-shot style configuration via loading
loading: Image.asset(
"assets/loading_gif_2.gif",
width: 100,
height: 100,
));
即使在定义全局样式后，在特殊位置，FLoading 依旧允许开发者在单次构建时，指定特殊的 Loading 样式。
🛰 定时隐藏和背景颜色
image
FLoading.show(
context,
loading: Image.asset(
"assets/loading_gif_1.gif",
width: 200,
height: 200,
),
/// 定时隐藏
///
/// Timed hiding
duration: 3000,
/// 配置背景样式
///
/// Configure background style
color: Colors.red[300].withOpacity(0.3),
)
FLoading 提供了定时自动隐藏和变更背景色的配置，以满足开发者们无限的创造力。
想要了解更多详细内容？请访问 FLoading 官方主页 (PS：别忘了投出一个你认可的 Star 哦 😘)。
😃 如何使用？
在项目 pubspec.yaml 文件中添加依赖：
🌐 pub 依赖方式
dependencies:
floading: ^<版本号>
⚠️ 注意，请到 pub 获取 FLoading 最新版本号
🖥 git 依赖方式
dependencies:
floading:
git:
url: 'git@github.com:Fliggy-Mobile/floading.git'
ref: '<分支号 或 tag>'
⚠️ 注意，分支号 或 tag 请以 FLoading 官方项目为准。
image
