仿即刻Flutter版本

题外话

即刻是我我的用的比较频繁的 APP 之一，但在个人手机一直有个 bug，播放视频时老是画面没有变化，须要手动推进下进度条才行，在更新了几个版本也没解决这个问题。再加上刚学了 Flutter，就尝试作了个 Flutter 版本的即刻，即刻页面比较多，因此没有彻底开发完，只开发了首页的信息流，信息详情，视频播放等几个用的最多的页面。

接口用的是即刻的接口和图标，这里是为了学习，请勿用作其余用途，一切后果由本身承担，版权归即刻全部

由于我自己学习 Flutter 的时间也才几个月，因此代码质量仍是有所欠缺的。

最近即刻被暂停服务了，因此 API 也调用不了，只能看看以前录制的片断。

源码地址：today

效果

国际惯例，先实现的效果图：

这里面属首页的信息流最复杂，由于涉及了不少的样式，有几个花了时间实现的：

• @ 人的效果，文字中有多个高亮显示的标签，点击能够跳转页面
• 搜索栏和列表的嵌套滚动

第二个花时间的是我的详情页面中，总体页面的嵌套滚动。

实现

首先看下项目的总体结构，这里面代码总体重构过一次，以前使用 ScopedModel，后面以为不太灵活，又换了相对热门的 Bloc 架构。

bloc

这个目录存放整个应用全部的 bloc 文件，按功能模块划分，最外层有一个 blocs 用于导出全部的 bloc 文件，每一个模块中有四个文件，分别是：

• bloc.dart：导出当前模块的 bloc
• xxx_event.dart：bloc 中的 event
• xxx_state.dart：bloc 中的 state
• xxx_bloc.dart：处理逻辑

network

网络层的代码在 network 目录下，用的是 dio 框架，这个框架用起来比较方便，API 的封装有点相似 okhttp，这里也写了个拦截器 BusinessInterceptor 用于处理 token 信息。接口定义放在 ApiRequest 里面，相关的数据模型放在 model 目录下，用的是 json_serializable。

UI

全部的页面存放在 ui 目录下，按功能模块划分，其中 ui_base.dart 存放一些基类，颜色常量等等。

flutterw

关于 Flutter 的版本问题，估计不少小伙伴也挺头疼的，特别是须要协做开发的。这里我本身写了一个相似 gradlew 的 flutterw，使用特定的版本的 Flutter 去编译，只须要将 flutter 改用为 flutterw 便可。

关于 flutterw 的更多介绍：解决Flutter版本不一致的flutterw

最后

模仿的页面很少，但仍是花了很多时间去写的，talk is cheap show me the code。