关于ui:制定一个计划开发总结-UI-设计和-Flutter-学习

31次阅读

共计 1182 个字符,预计需要花费 3 分钟才能阅读完成。

我集体比拟偏好简洁的 UI 设计,惋惜不是相干业余,刚开始时齐全没有方向。像很多 UI 工程师一样(跟我司 UI 学的),我第一件做的事件就是上 dribbble 寻找灵感,看到适合的就珍藏下来,好日后进行模拟。

上面的截图这是过后珍藏的一些 UI 设计。

dribbble 上难看的设计切实太多,可是要把收集到的碎片重整为本人须要的样子就不太容易了。“灵感”收集得差不多了,接下来就本人摸索着在 Figma 画页面,同时也能把一些性能和交互确定下来。

UI 设计上花了很长时间,但看看最终上线后理论的 UI,与当初设计的也相差太大了????。边做边改,有的性能长期决定放到下个版本,有的界面实现之后没有达到预期的成果,有的性能决定不要了。随便一点吧,反正一切都是本人做主。

对于 Flutter

Flutter 要应用 dart 语言进行开发,开始学习 Flutter 之前要简略看下 dart。能够跟着官网提供的 Tour 走一遍,看完也就差不多了。

而后学习 Flutter。Flutter 的学习文档很多,社区也很沉闷。中武官网的 开始应用 涵盖了所有初学者须要晓得的知识点。

学习 Flutter 比当初学习 Android 容易许多,两头没有碰到太多问题。而且用 Flutter 开发让人感觉比拟顺畅,你冀望达到什么成果,写好代码后热重载立马能看到成果,而且往往跟你的预期是统一的。比较烦人的是环境配置,之后的依赖下载 (网络问题) 等,耗时间。

学习 Flutter 时 Dart 的异步模型是必须要学习的,比拟重要,也有肯定难度。在进行一些耗时操作,如网络申请(这个利用将会应用到的 RPC Call),文件读取时就会用到。举荐两篇文章:

  1. Flutter(五)之彻底搞懂 Dart 异步
  2. Flutter/Dart 中的异步

还有一点比拟重要的是 BLoC(Business Logic Component) 模式,应用 BLoC 模式开发 Flutter App 能够无效的隔离 UI 显示 代码和 业务逻辑(状态治理) 代码。看看上面???? 这张经典的图例:

BLoC 模式遵循上面的步骤解决用户事件:
1) 用户与 App 交互产生事件(events),events 通过 Sinks 发送给 BLoC
2) BLoC 对事件进行解决,并更新保护在 BLoC 内的状态数据
3) BLoC 通过 Streams 将新的状态数据发送给 widgets,widgets 再对这些状态数据进行渲染。

应用 BLoC 模式可能很好的将代码进行解耦。

  1. 咱们能够随时批改业务逻辑代码,同时使批改对 UI 显示的影响最小
  2. 能够随时批改 UI 显示,同时使业务逻辑受到的影响最小
  3. 更容易对业务逻辑代码进行测试

对于开发过程的总结留到下篇文章再进行总结,以及后续的 TestFlight 测试,App Store 审核等事项的总结。

代码已开源,你能够在这里找到:makeaplan。如果想反对并体验一下 App,能够在 这里 下载(目前只有 ios 版本,android 版本正在策划)。

正文完
 0