開工第一天,來點輕松的資源推薦。
這是一篇實戰類資源推薦,其實Flutter的入門資料官方已經做得很好了,如果你是零基礎,還是建議先啃一遍官方的教程,然后再看以下實戰資源,相信在你看官方課程中涉及到的一些疑問,下面的資源會有一些剛好能夠解答。
入門 Flutter官網:
https://flutter.io/get-started/install/
當然,也有飽含分享精神的同學已經搭建了 Flutter 中文網:
https://flutterchina.club/get-started/install/
1
Flutter完整開發實戰詳解
這是戀貓月亮給大家寫的一個系列,之前作者寫過移動端跨平臺開發的深度解析,也針對RN,Weex,Flutter分別開源了一個復雜度還是比較高,功能超級完整的github客戶端。
- RN
- https://github.com/CarGuo/GSYGithubAPP
- Flutter
- https://github.com/CarGuo/GSYGithubAppFlutter
- Weex
- https://github.com/CarGuo/GSYGithubAppWeex
所以作者寫的Flutter實戰文章肯定也是非常棒的:
- Flutter完整開發實戰詳解(一、Dart語言和Flutter基礎)
- https://www.jianshu.com/p/533b5b8d2f71
- Flutter完整開發實戰詳解(二、 快速開發實戰篇)
- https://www.jianshu.com/p/5768a999790d
- Flutter完整開發實戰詳解(三、 打包與填坑篇)
- https://www.jianshu.com/p/29ba30d1ee57
- Flutter完整開發實戰詳解(四、 Redux、主題、國際化)
- https://www.jianshu.com/p/34a6224e0cf1
2
一些很適合新手練習的Demo
關注本號的幾乎都是Android的開發者,那么在學習Flutter,或者在使用Flutter開發項目的時候,本能的就會和Android中開發效果實現想到一起,
例如實現各底部Tab,右滑返回,頁面滑動,高斯模糊,圖片放大縮小,閃屏頁,動畫等...
但是很多時候我們在尋找類似效果時,代碼比較復雜,并不便于學習。
所以本資源目的,就是最簡化的實現各種效果,這樣對我們剛接觸Flutter的開發者就非常友好了,不至于:

https://github.com/OpenFlutter/Flutter-Notebook
為什么有了官方sample還需要整理這個合集
讓代碼講故事
所以我開始整理一些小的demo,專注于單一功能的實現,盡量讓代碼解釋自己,我認為這是學習flutter最快的方式。
每個demo我盡量控制在100行代碼以內,讓代碼講一個短小但又精彩的故事。其中也有不少國外的哥們寫的好的demo也被我收錄進來了。
目前包含:
視圖
- BottomNavigationBar底部導航
- BottomAppBar底部導航
- SliverAppBar+TabBar頂部導航
- 高斯模糊(毛玻璃)
- 切換頁面,保持各頁面狀態
- 制作一個精美的Material風格搜索框
- TextField的焦點及動作
功能
- 返回上一頁時彈出提示信息
- 應用開啟進入閃屏頁
- 上拉加載,下拉刷新
- json自動反序列化
- 左滑刪除ListView中Item
- 右滑返回上一頁
- 在flutter中截屏
優秀第三方庫
- 應用介紹頁——slider
- 應用介紹頁——intro_view
- 從本地相冊選取多張圖片
- 使用url_launcher喚醒功能
- 拿捏圖片放大縮小
動畫
- 基本動畫樣例
- 神奇的Hero動畫
- Spinkit——一個很棒的等待動畫庫
- AnimatedContainer
- AnimatedCrossFade
效果圖太多,就不貼了。作者還寫了日更,為作者的付出精神點贊,不過日更太困難了,周更就很好啦。
3
其他
此外還有一些優質的Flutter資源聚合項目
- https://github.com/AweiLoveAndroid/Flutter-learning
- https://github.com/yang7229693/flutter-study
- https://github.com/Solido/awesome-flutter
就不一一介紹了。
另外,關于完整項目,之前推送過:
- 推薦幾個優質Flutter 開源項目
對于項目還是比較容易搜索的,直接github搜索即可。
也歡迎大家利用一些open api 自己編寫:
- http://wanandroid.com/openapis