写点什么

产品级 Flutter 开源项目 FunAndroid,Provider MVVM 的最佳实践

用户头像
Android架构
关注
发布于: 2 小时前


  • DarkMode 自动跟随系统设置

  • App 更新组件调整

  • 适配 Dio3.0 版本

  • pull_to_refresh 更新:加入国际化

V0.1.6 2019-09-20

  • 修复收藏列表进入详情时,页面报错的 bug

V0.1.5 2019-09-19

  • Flutter SDK 更新至 Channel dev, v1.10.3,修复我的页面莫名卡死的问题

  • 修改 Android 端 App 名称为 Fun Android

V0.1.4 2019-09-18

  • 适配 Flutter 1.9.x

  • Android 加入版本更新

  • 加入 LeanCloud API 云服务

  • 移除修复首页黑屏问题的代码官方在1.10.1版本已修复

  • 移除之前屏幕适配方案,对 NativeView 影响过大

  • 修复版本更新导致的 AppBar 中进度条颜色与背景色不明显的问题

  • 重构 Http 使用方式,解耦性更好

  • 首页 banner 高度调整

  • Android 状态栏透明

2019-09-10

  • flutter 版本更新

  • 适配更新 AppBar 区域 CupertinoActivityIndicator 的主题色彩冲突

  • 移除 OffState 和 Indicator 的组合使用,优化性能

  • 调整 textField 的 clear 实现方式,防止报错

2019-09-09

  • 修复各页面里文章 收藏 状态没有同步的问题

  • 首页收藏后,其他 tab 页对应 item 的收藏状态同步

  • 我的收藏页面里移除收藏.其他页面状态同步

  • 登录登出后各页面收藏状态刷新

  • 如果相同账号在其他平台修改过收藏状态,只需要刷新列表即可同步收藏状态.(WanAndroid 接口目前存在问题)

  • 优化 Dropdown 弹出动画

  • 首页初次加载数据禁用上拉记载更多功能

  • 登录页面输入框可通过回车键切换

2019-08-30

  • 修复积分数值在登录后没有刷新的 bug

  • 修复进入 Splash 页面短暂黑屏的 bug

  • 修复未登录时,点击收藏还可以播放动画的 bug

  • 默认主题色调整为亮色

2019-08-29

  • 添加积分记录和排行榜功能

2019-08-28

  • 在设置中添加 WebViewPlugin 的开关

  • 在详情中移除收藏后,回到收藏列表页面自动刷新

2019-08-26

  • 更新收藏动画的实现方式,之前实现的方式侵入性太强,每个页面都要先隐藏一个小??。现在换了路由?Hero 的思路,重新调整了 Flare。显示动画一行代码就 ok。(如果你运行代码之后发现,该动画与图上会有一丝丝不一致,列表项右下角的小心会闪一下.不用担心那是 flutter 的 bug,目前在 master 分支已经修复.见[pr-37341](


))


项目结构

|![项目结构 1](https://user-gold-cdn.xitu.io/2019/9/18/16d43cec08


《Android学习笔记总结+最新移动架构视频+大厂安卓面试真题+项目实战源码讲义》
浏览器打开:qq.cn.hn/FTe 免费领取
复制代码


09ff91?imageView2/0/w/1280/h/960/ignore-error/1)


|



Provider MVVM 的简单使用方式

  • 快速添加一个拥有下拉刷新,上拉加载更多的页面.比如开发一个玩Android首页列表页面


  1. Model



  1. ViewModel



  1. View



以上是 Provider 结合 ViewModel 的基础使用方式,考虑了 App 中会出现的比较全面的情况,希望大家一起探讨使用方式


另外在判断页面状态的时候,其实拿model.viewState == ViewState.busy会更严谨一点.为了书写方便,加了一个对应方法

这里能找到什么?

  1. Provider 状态管理的最佳实践,虽然 Google 很早就废弃了Provide,宣布[Provider](


)为推荐的状态管理工具,可是在开发中,我们总是会遇到很多问题。


  1. 比如Provider的几个衍生类在具体的业务中应该怎么使用?

  2. 页面最初需要的数据什么时候进行初始化,在哪里初始化。

  3. 如何将页面的几个常用状态loadingerroremptyidleunAuthorized进行组合使用。

  4. 常用的下拉刷新上拉加载更多应如何服用才能效果更佳。

  5. Widget 在 dispose 后,model不再 notify()。

  6. 清晰的代码结构。

  7. 让页面归页面,让业务归业务,所有的业务逻辑都在view_model中,Widget 只关注页面本身。

  8. 不要再满屏幕的 setState()。

  9. 同一页面内可以利用 Flutter 框架给我们提供的各种 XxxBuilder,来局部刷新。

  10. 多层嵌套可使用前边提到的Provider

  11. 当然颗粒度足够细的 Widget,还是要使用 setState()。eg: [ChangeLogPage 中的 ChangeLogView](


) 功能单一,刷新不会影响别的 widget。


  1. 实现了 App 的基础功能,可 copy 当作模板代码快速开发

  2. 主题切换

  3. 夜间模式切换

  4. 字体切换

  5. 漂亮的骨架屏

  6. 利用IDE插件i18n进行国际化

  7. Dio 结合 Cookjar,实现玩Android的登录功能

  8. AnimationList 结合 SmartRefresh 的常规数据加载

  9. 当然还有 WanAndroid 本身也有不错的内容,每日闲暇时,可以读一读。

未完成的功能

  1. 首页二楼目前是我个人的 blog,也无法前进后退。后期会放一个 flutter 专题。

  2. Hero 动画,在非最后一个 tab 登陆时,logo 的动画会漂移到最后一个,需要加状态判断。

  3. 退出登陆加入动效。

目前已知存在的问题

  1. [webview_flutter](


) 插件的问题还是很多,有些链接点击会没有反应,不会跳转。所以接入了两套 WebView 方案


  1. [webview_flutter](


) 不能结合CustomScrollView滑动。见[issue](


) 。


  1. 两个同样颜色的 widget,中间莫名其妙的会多一条背景色的线。见[issue](


) 。

Future

  • 后期会上线大量博客,来讲述这个项目里所遇到的问题及解决的思路。

寻找组织

  • Fun Flutter 微信交流群


作者的话

  • 坐标上海,打算找 Flutter 方向的工作.4 年 Android 开发经验.

感谢

  1. 感谢 [V2Lf](


) 开源项目,很早就在 TestFlight 中下载了该 App,那时还没开源。萌生了想做一个开源的 App 的想法。


  1. 借鉴了goweii[WanAndroid](


)项目的 UI,最美原生版 WanAndroid,感谢。


  1. 在实践 Provider 时,发现了[Tutorials](


),作者 Youtube 的教程很好。


  1. 感谢优秀的[pull_to_refresh](


)刷新库。


  1. 感谢站酷提供的开源的字体。

  2. 感谢 WanAndroid 提供的 API。

关于作者

  • [Github](


)


  • [个人博客](


)


  • [掘金](


)


  • [简书](


)


  • Email: moran.fc@gmail.comLicense=======Copyright 2019 phoenixskyLicensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at

用户头像

Android架构

关注

还未添加个人签名 2021.10.31 加入

还未添加个人简介

评论

发布
暂无评论
产品级Flutter开源项目FunAndroid,Provider MVVM的最佳实践