Flutter之旅

Day 1　初識Flutter與技能儲備 1
1.1　Flutter初始項目分析 1
1.1.1　Flutter初始項目結構 1
1.1.2　入口文件及MyApp分析 2
1.1.3　MyHomePage與_MyHomePageState分析 5
1.1.4　pubspec.yaml文件 6
1.2　基本Debug技能 7
1.2.1　斷點和放行 7
1.2.2　變量查詢和喚醒程序 8
1.2.3　Debug要點補充 9
1.3　輔助技能儲備 10
1.3.1　三個實用工具 10
1.3.2　片段代碼和快速重構 12
1.3.3　三個基礎知識QA 14
1.4　Widget知識儲備 15
1.4.1　命令式UI編程與聲明式UI編程 16
1.4.2　認識Widget體系 16
1.4.3　Widget源碼初識 18
1.4.4　組件的提取抽離 21

Day 2　Dart實用語法速覽 23
2.1　基礎語法 23
2.1.1　常用的數據類型 23
2.1.2　變量與常量 26
2.1.3　函數的使用 27
2.2　通過Size類看Dart中的面向對象 30
2.3　其他語法點 34
2.3.1　常用符號與關鍵字 34
2.3.2　庫的使用和可見性 35
2.3.3　泛型 36
2.3.4　異步 37
2.3.5　異常處理 38

Day 3　界面風格和簡單繪制 39
3.1　Material風格 40
3.1.1　Scaffold和BottomNavigationBar 40
3.1.2 TabBar和TabBarView 41
3.1.3 標題欄按鈕和菜單組件 42
3.1.4 彈出對話框 43
3.1.5 界面的左右滑頁 43
3.1.6 showSnackBar和showBottomSheet 44
3.2 Cupertino風格 45
3.2.1 CupertinoPageScaffold和CupertinoTabScaffold 46
3.2.2 CupertinoNavigationBar和CupertinoTabBar 46
3.2.3 CupertinoTabView 47
3.2.4 CupertinoAlertDialog和showCupertinoModalPopup 47
3.3　認識CustomPainter繪制 49
3.3.1　繪制網格 49
3.3.2 Canvas初級繪制 50
3.3.3 移植繪制n角星 52
3.3.4 移植繪制粒子數字 54

Day 4　基礎Widget 56
4.1 Text組件 56
4.1.1 Text的基本使用 56
4.1.2 Text的陰影和裝飾線 57
4.1.3 文字方向、對齊和溢出處理 58
4.1.4 RichText的使用 59
4.1.5 RichText與Text.rich 60
4.2　Image組件 60
4.2.1　Image資源的加載 61
4.2.2 圖片的適應模式 62
4.2.3 圖片顏色及混合模式 63
4.2.4 圖片對齊模式及重復模式 63
4.2.5 用centerSlice實現圖片局部放大 64
4.3　Container的使用 65
4.3.1 Container的基本使用 65
4.3.2　Padding的使用 66
4.3.3 Container的邊線裝飾 66
4.3.4 Container的約束和變換 67
4.3.5　Container與布局的淵源 68
4.4　常用多子布局 71
4.4.1 圖解Flex布局 71
4.4.2　Stack布局 75
4.4.3　Wrap包裹布局 76

Day 5　列表與滑動 79
5.1　組件封裝 79
5.1.1　靜態(tài)布局 79
5.1.2　頭像組件封裝 80
5.1.3　條目組件封裝 81
5.1.4　封裝聊天信息組件 82
5.2　ListView的使用 84
5.2.1　基本用法 85
5.2.2　ListView的構造及分隔線 85
5.2.3　ListView的不同樣式 87
5.2.4　ListView的上拉與下拉 87
5.3　常用滑動組件 90
5.3.1　單子滑動組件SingleChildScrollView 90
5.3.2　滑動控制器ScrollController 92
5.3.3　滑頁組件PageView 94
5.3.4　網格組件GridView 97
5.4　Sliver家族 99
5.4.1　SliverAppBar的使用 100
5.4.2　Sliver中的列表布局、網格布局及普通布局 101
5.4.3　吸頂效果SliverPersistentHeader 103

Day 6　動畫與路由 106
6.1　動畫閑談 106
6.1.1　FPS 106
6.1.2　動畫控制器AnimationController 107
6.1.3　運動盒 108
6.2　Flutter動畫詳解 111
6.2.1　Animation和Animatable 111
6.2.2　動畫狀態(tài)監(jiān)聽和Animation方法 116
6.2.3　動畫簡化和封裝 117
6.2.4　封裝強化版FlutterContainer 118
6.3　路由與導航 122
6.3.1　打開路由 122
6.3.2　路由的傳參 125
6.3.3　路由的跳轉動畫 128
6.3.4　Hero跳轉動畫 130

Day 7　手勢組件與自定義組件 132
7.1　手勢組件與使用 132
7.1.1　InkWell水波紋的使用 132
7.1.2　GestureDetector的使用 133
7.1.3　手寫板的實現 135
7.2　根據現有組件實現自定義組件 137
7.2.1　切換Widget組件 137
7.2.2　顏色選擇圓鈕組件ColorChooser 139
7.2.3　函數運動組件MathRunner 142
7.3　繪制自定義組件 143
7.3.1　能力分析組件AbilityWidget 143
7.3.2　圖片放大組件BiggerView 147
7.3.3　波紋線RhythmView 150

Day 8　Flutter渲染機制 153
8.1　認識三棵樹 153
8.1.1　漫談Widget、Element、RenderObject
8.1.2　認識RenderObject和Element
8.1.3　三棵樹結構
8.1.4　三個根結點的初始化
8.2　Element的裝配 162
8.2.1　RenderObjectToWidget-Element的裝配
8.2.2　StatelessElement和StatefulElement的裝配
8.2.3　多子元素掛載
8.3　State類全解析 168
8.3.1　State的生命周期回調
8.3.2　State切換和跳轉時生命周期測試
8.3.3　setState做了什么

Day 9　異步與資源 178
9.1　認識異步與流 178
9.1.1　Dart中的異步任務
9.1.2　Dart中的流
9.2　文件中的異步與流 184
9.2.1　文件的簡單操作
9.2.2　文件讀寫的異步操作
9.2.3　文件讀寫的流操作
9.2.4　使用文件打造圖標轉換工具
9.3　網絡請求與json解析 193
9.3.1　使用GitHub開放API 測試網絡訪問
9.3.2　json解析
9.3.3　異步方法的基本使用

Day 10　數據共享與狀態(tài)管理 202
10.1　數據共享和參數傳遞 202
10.1.1　數據共享的傳統實現方式
10.1.2　用InheritedWidget實現數據共享
10.2　狀態(tài)管理的原始處理過程 207
10.2.1　數據準備與界面說明
10.2.2　FutureBuilder與StreamBuilder的使用
10.3　使用插件進行狀態(tài)管理 213
10.3.1　BLoC對數據狀態(tài)的管理
10.3.2　Provider對數據狀態(tài)的管理
10.3.3　Redux對數據狀態(tài)的管理

Day 11　數據持久化和讀取 230
11.1　Flutter中的數據庫存儲
11.1.1　數據庫的初始化
11.1.2　使用sqflite進行增刪改查
11.1.3　數據庫數據與UI界面的對接
11.2　表單與數據持久化 240
11.2.1　表單注冊頁
11.2.2　持久化json數據和讀取
11.2.3　持久化XML數據和讀取

Day 12　插件及混合開發(fā) 245
12.1　Flutter和平臺間的通信方式 246
12.1.1　Flutter/Dart端
12.1.2　Android/Kotlin端
12.1.3　用toast連接兩個世界
12.1.4　Flutter向平臺傳參
12.1.5　插件的使用和上傳
12.2　Flutter常見插件的使用 255
12.2.1　路徑插件和權限插件
12.2.2　音頻播放插件audioplayer
12.2.3　視頻播放插件video_player
12.2.4　圖片拾取器image_picker
12.2.5　通過webview_flutter使用已有Web頁面
12.3　Flutter的混合開發(fā) 264
12.3.1　Flutter和Android混合開發(fā)
12.3.2　Flutter和iOS混合開發(fā)
12.3.3　讓Android視圖加入Flutter