开源两段 Flutter 代码 | 开发者说·DTalk

本文原作者: 功夫小猫，原文发布于微信公众号: Tabenren

https://mp.weixin.qq.com/s/nyCp9KaWpMqyzVnbv_07Iw

老习惯，每尝试一种新技术，都会布置给自己一个作业，直到完成作业，尝试才算告一段落，对于 Flutter 的研究，大约有几个月的时间了，这里做了两个应用片段，发布到了 Github 上。

• Github

  https://github.com/flutter-samples/flutter-design-pattern

应用一: 关于设计模式

我们知道 Flutter 极大程度的借鉴了 React，比如我们较熟悉的 "Setstate" ，单画面的状态维护，通过 "Setstate" 很方便，然而当画面较多，交互较为复杂时，需要状态管理，在 Flutter 中，对于状态管理有很多种实现方式，Google 官方自己也设计了一套解决方案，然而有意思的是，有一位名为 "Remi Rousselet" 的开发者，开发了自己的一套状态管理，名为 "Provider" ，可能是代码写得太优秀了，以至于 Google 在 I/O 大会上宣布 Flutter 状态管理推荐使用 Remi Rousselet 的依赖包，而非 Google 官方的开发，在两个月之前，Google 还在官方的 Sample 中特意创作了一个实例 "Shopper" ，采用 "Provider" 描述怎么进行状态管理。

我写的这个例子，借鉴了 Google 官方 "Shopper" ，进行了一些改动的同时，也将从 UI 到数据处理的整个过程进行了设计模式的梳理，会让开发者从 UI 开发到数据处理，整个过程更清晰，下图是流程描述 "目前实现了内存处理数据和 Sqlite 处理数据" 。

功能效果，大致是购物分类和购物车两个画面，如下图:

应用二: 关于 UX

我们知道字节跳动公司之前推出一款社交工具，叫 "飞聊" ，我个人认为飞聊的用户体验设计要比微信更优秀，特别是某些细节方面，这个例子模拟飞聊的分享的画面，也类似于 Messaging 的聊天画面，效果如下:

大致有三个画面: 文字输入+键盘调用、图片选择、表情插入，虽然功能较为简单，交互也不算复杂，为了让代码更清晰，使用了 11 个 dart 文件来设计，其中 10 个 dart 文件代码行数不超过 100 行，尽量做到清晰可读。

• Github

  https://github.com/flutter-samples/flutter-social-messager

---

"开发者说·DTalk" 面向中国开发者们征集 Google 移动应用 (apps & games) 相关的产品/技术内容。欢迎大家前来分享您对移动应用的行业洞察或见解、移动开发过程中的心得或新发现、以及应用出海的实战经验总结和相关产品的使用反馈等。我们由衷地希望可以给这些出众的中国开发者们提供更好展现自己、充分发挥自己特长的平台。我们将通过大家的技术内容着重选出优秀案例进行谷歌开发技术专家 (GDE) 的推荐。

 点击屏末 | 阅读原文 | 了解更多 "开发者说·DTalk" 活动详情与参与方式

长按右侧二维码

报名参与

---