一个非常美的FlutterUI组件扩展集：FLUI

项目地址

FLUI 官网

下载 Demo APK 体验

这是一个群内的网友写的，感觉里面的组件风格非常美，封装的挺到位的，在此推荐给大家，具体可以参考学习。

可以学到的知识还是挺多的，组件UI封装可以很大的提高页面的速度效率，封装是一个非常重要的技能。

适合广大Flutter爱好者。

丰富易用/简易定制/高效反馈。

请确保 Flutter 的版本 >= v1.7.8+hotfix.1



关于主题，由于 Flutter 本身对主题的支持（配置，切换等）已经足够强大，所以 FLUI 设计的初衷就是无风格化的组件，尽可能的从组件树中读取 ThemeData，另外大部分组件也是支持对颜色，样式进行设置的。

FLUI 里大部分组件的选择都是基于一致性，根据用户在各个平台的使用习惯迁移过来，这里也参考了很多其他平台上成熟的 UI 框架比如 Antd, QMUI, Vant 等等，由于 Flutter 未来面向的平台众多，所以能做的组件还是一个比较大的体量。

FLUI 还有另外一个目标就是提供交互反馈，比如支持显示 loading 的按钮，toast，支持伸缩和 shimmer 动画的骨架屏，支持点击效果的 ListTile 等等，这样用户可以清晰地感知到自己的操作，也能很好的标明当前页面的状态。

简介

FLUI 的组件是在 Flutter 框架上进行的扩展，目前已经有 15 个类别并且在不断增加。

每个组件几乎都是独立的（少数有相互依赖），引入时可以直接 import 'package:flui.dart' 也可以 import 'package:flui/widgets/avatar.dart'，编译打包时 tree-shaking 会接管依赖的优化流程。

未来 FLUI 也会加入一些业务组件，比如图表，图片选择器等等，关于组件的动态化配置和渲染也在探索中。

特性

• 开箱即用的高质量 Flutter UI 组件
• 完善的使用示例和文档
• 细粒度非风格化的组件适用于不同类型的应用

兼容性

FLUI 在多端具有良好的兼容性，框架会一直基于 Flutter Stable Channel 开发。

快速上手

安装

dependencies:
  flui: 0.7.4

然后运行 flutter pub get 下载依赖。

使用

依赖安装完成后直接引入组件。

import 'package:flui/flui.dart

// in somewhere
FLAppBarTitle(
    title: 'AppBar',
    subtitle: '(subtitle)',
    layout: FLAppBarTitleLayout.vertical,
    showLoading: true
)

内有各种丰富的组件，具体项目内查看。

大家如果有其他更好的也可以投稿上来，或者在下方评论。

Flutter交流QQ群：874592746

Flutter微信群

微信公众号

关注公众号“Flutter前线”，各种Flutter项目实战经验技巧，干活知识，Flutter面试题答案，等你来领取。