当中国诗词大会邂逅了 Flutter,从此我的眼里只有你!(1)
Flutter 项目的开发语言是 Dart,Dart 是由 Google 开发的一种面向对象语言,可以编译成 ARM 和 x86 代码直接运行在 iOS、Android 设备上。
推荐先学习 Dart 语言[官方教程](
),对 Dart 有初步了解之后再进行 Flutter 的学习和开发。
[](
)界面开发
终于可以进入 Flutter 本身了。
[](
)Widget
Flutter 中页面所有元素都是 Widget,又分为 StatelessWidget 和 StatefulWidget。
顾名思义,StatelessWidget 就是指无可变状态的 Widget,这类 Widget 的状态只由创建 Widget 时传入的参数决定,一旦创建,其状态、在页面上的展示效果也就不再改变。
而 StatefulWidget 内部则存在着可变状态。当通过 setState 改变这些状态时,Flutter 会重新渲染该 Widget。
[](
)布局
在实际开发中,主要使用了 Row、Column、Container、Expanded、Stack 等。
Row、Column 提供了水平、垂直方向的布局,Stack 提供了堆叠方式的布局,各种容器有不同的特性,可根据实际页面需求选择搭配不同的布局。
推荐学习?[官方文档](
)?及?[国内维护的中文翻译](
)。
[](
)主要插件
话题切回到诗词汇 APP,本 APP 收集了 4000 余位诗人的 30 多万首诗词,提供了古诗词的查询、收藏、朗诵功能,并且实现了初步的社区功能。
项目目录结构如下:
开发这个 APP 大概用了一个月的业余时间,每天抽出一两个小时,这样折算为工作日,大概是两个星期左右,开发效率还是很高的。
下面跟大家分享一下主要功能及所使用的一些插件。
[](
)切换主题
为了实现实时切换主题颜色,使用了状态管理插件。
[flutter_redux](
)?。
[](
)极光推送
在国内厂商中,极光是少有的对 Flutter 提供了技术支持的,这里给极光大大的??。
[jpush_flutter](
)
[](
QQ 的 Flutter 插件提供了基本的登录、分享功能。
[flutter_qq](
)
[](
)微信
微信的 Flutter 插件提供的功能稍微丰富,包含了支付、登录、分享、启动小程序的功能。
[fluwx](
)
[](
)事件总线 Event Bus
大名鼎鼎的 event_bus 也提供了对 Flutter 的支持。
[event_bus](
)
[](
)音频
录音及播放音频也有很好的支持。
[audio_recorder](
)
[audioplayer2](
)
[](
)其它
其它诸如加载 HTML、Toast 提示、图片选择器、图片加载等也有较好的插件支持。
可在?[官方插件库](
)?查询相关的插件。
[](
)坑
[](
)安装、升级
FLutter 的安装、升级会经常遇到卡死的问题,主要原因就是使用了 Google 的源,但是莫名的,即使使用了上网、设置了国内镜像后,也会遇到同样的问题。只能通过反复的flutter doctor
?或?flutter upgrade
直到解决问题。
[](
)开发
由于笔者最近一段时间 Android 项目做得较多,习惯了 Android 的 XML 布局方式,对于在代码中编写页面的形式一开始还有些不习惯,但是在按照官方例子实践了几个页面后,用代码写页面的优势就体现出来了。
在页面已经设计好的情况下,开发的时候脑海中就构思出一个 Widget 树,从根节点到每一个节点一级一级嵌套下去,自然而然的布局就写好了。
[](
)Dialog 弹出框
使用 Dialog 的时候,弹出 Dialog 的 Context 及 Dialog 本身都会压入栈中,所以让 Dialog 消失的方法是Navigator.of(ctx).pop()
,这样的设计既不同于 Android 也不同于 iOS,也许跟 Flutter 本身所有元素都是 Widget 的设计有关。
[](
)编译
在编译 Android 版本的时候很顺畅,没有遇到任何问题。但是在编译 iOS 版本的时候,遇到了很多问题,直到现在也没有解决。
问题在于使用了`audio_recorde
r和
flutter_qq两个插件,而这两个插件一个要求编译选项需要设置
!use_framework`,一个要求不能设置,造成了冲突,在实际编译中一直编译不通过。
[](
)结语
开发结束,最终打包了 Release 版本的 APK,安装到手机后,发现惊喜。
竟然如丝般顺滑,这是我始料未及的,转场效果、页面相应速度不输原生 APP。
总而言之,个人对 Flutter 的前景相当看好,毕竟是 Google 大厂出品,并且项目本身的迭代速度很快,目前已经是 0.11 版本,期望在不远的将来发布正式的 1.0 版本,更期望国内厂商加大对 Flutter 的支持力度。
**顺便推广一下笔者的诗词汇 APP,欢迎大家?[下载试用](
)?,或者访问?[诗词汇](
)?体验下 Flutter 如丝般的顺滑。_**
评论