题外话

即刻是我个人用的比较频繁的 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。