仿即刻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。