精仿抖音-推薦5個(gè)Flutter重磅開(kāi)源項(xiàng)目!
1.Flutter精仿抖音
Flutter精仿抖音開(kāi)源了,左滑搜索,右滑個(gè)人中心,上下滑動(dòng)刷視頻,雙擊點(diǎn)贊冒愛(ài)心,無(wú)敵精仿,感謝點(diǎn)Star。
◆? ?應(yīng)用截圖

◆? ?實(shí)現(xiàn)功能
上下刷視頻,視頻會(huì)自動(dòng)加載封面
左右滑動(dòng)去搜索與個(gè)人中心
雙擊冒愛(ài)心點(diǎn)贊
看評(píng)論
切換底部Tabbar
◆? ?項(xiàng)目結(jié)構(gòu)
??#?加載動(dòng)畫(huà)庫(kù)(好像改版之后就沒(méi)用到了)
??flutter_spinkit:?^4.1.2
??#?Bilibili開(kāi)源的視頻播放組件
??fijkplayer:?^0.8.3
??#?基礎(chǔ)的透明動(dòng)畫(huà)點(diǎn)擊效果
??tapped:?any
??#?map安全取值
??safemap:?any
./lib
├──?main.dart
├──?mock
│???└──?video.dart?#?假數(shù)據(jù)
├──?other
│???└──?bottomSheet.dart?#?修改了系統(tǒng)BottomSheet的高度
├──?pages
│???├──?cameraPage.dart?#?拍攝頁(yè)(沒(méi)有實(shí)際功能)
│???├──?followPage.dart??#?略
│???├──?homePage.dart?#?主頁(yè)面,包含tikTokScaffold的實(shí)際應(yīng)用功能
│???├──?msgDetailListPage.dart?#?略
│???├──?msgPage.dart?#?略
│???├──?searchPage.dart?#?略
│???├──?todoPage.dart?#?略
│???├──?userDetailPage.dart?#?略
│???├──?userPage.dart?#?略
│???└──?walletPage.d?#?略
├──?style
│???├──?style.dart?#?全局文字大小與顏色
│???└──?text.dart?#?主要的幾個(gè)文字樣式
└──?views
????├──?backButton.dart?#?iOS形狀的返回按鈕組件
????├──?loadingButton.dart?#?可以設(shè)置為載入樣式的按鈕組件
????├──?selectText.dart?#?可設(shè)置為“選中”或者“未選中”樣式的文字
????├──?tikTokCommentBottomSheet.dart?#?仿Tiktok評(píng)論樣式
????├──?tikTokHeader.dart?#?仿Tiktok頂部切換組件
????├──?tikTokScaffold.dart?#?仿Tiktok核心腳手架,封裝了手勢(shì)與切換等功能,本身不包含UI內(nèi)容
????├──?tikTokVideo.dart?#?仿Tiktok的視頻UI樣式封裝,不包含視頻播放
????├──?tikTokVideoButtonColumn.dart?#?仿Tiktok視頻右側(cè)的頭像與點(diǎn)贊等按鈕列的組件
????├──?tikTokVideoGesture.dart?#?仿Tiktok的雙擊點(diǎn)贊效果
????├──?tikTokVideoPlayer.dart?#?視頻播放頁(yè)面,帶有控制滑動(dòng)的VideoListController類(lèi)
????├──?tiktokTabBar.dart?#?仿Tiktok的底部Tabbar組件
????├──?tilTokAppBar.dart?#?仿Tiktok的Appbar組件
????├──?topToolRow.dart?#?用戶頁(yè)面的頂部狀態(tài),在tab切換到user頁(yè)面時(shí)隱藏返回按鈕
????└──?userMsgRow.dart?#?一條用戶信息的樣式組件
◆? ?項(xiàng)目地址
https://github.com/mjl0602/flutter_tiktok
2.Flutter斗魚(yú)APP
◆? ?應(yīng)用截圖



◆? ?主要涵蓋功能
滑動(dòng)狀態(tài)導(dǎo)航、輪播圖
移動(dòng)端px兼容
封裝HTTP、IO緩存操作
頁(yè)面路由傳值
bloc全局狀態(tài)管理
禮物橫幅動(dòng)畫(huà)隊(duì)列
彈幕消息滾動(dòng)
接入靜態(tài)視頻流
九宮格抽獎(jiǎng)游戲
照片選擇
webView容器
◆? ?項(xiàng)目地址
3.Flutter豆瓣客戶端
◆? ?應(yīng)用截圖





◆? ?功能介紹
首頁(yè) pages/home
home_page.dart 首頁(yè)
my_home_tab_bar.dart 首頁(yè)tab
書(shū)影音 pages/movie
detail_page.dart 影片、電視詳情頁(yè)面
person_detail_page.dart 演員頁(yè)面介紹
小組 pages/group
市集 shop_page.dart
我的 page/person
◆? ?項(xiàng)目地址
4.Flutter開(kāi)源中國(guó)客戶端
基于Google Flutter的開(kāi)源中國(guó)客戶端,支持Android和iOS。
◆? ??應(yīng)用截圖
iOS


Android



◆? 功能
登錄(使用osc賬號(hào))
查看資訊(未登錄即可查看)
查看、回復(fù)、發(fā)表、評(píng)論動(dòng)彈(需要登錄)
動(dòng)彈小黑屋(需要登錄)
“發(fā)現(xiàn)”部分的功能基本上都是用H5實(shí)現(xiàn)
◆??項(xiàng)目地址
https://github.com/yubo725/flutter-osc
5,咸魚(yú)技術(shù)解析與實(shí)戰(zhàn)
閑魚(yú)是國(guó)內(nèi)最早接觸使用 Flutter 的團(tuán)隊(duì),經(jīng)過(guò)多次研討驗(yàn)證并大規(guī)模上線,在App性能、穩(wěn)定性、開(kāi)發(fā)效率上收益甚多。

這本書(shū)并非基礎(chǔ)知識(shí)的簡(jiǎn)單羅列,而是從一線問(wèn)題出發(fā),循序漸進(jìn),娓娓道來(lái)。

