Flutter之旅

Day 1　初識Flutter與技能儲備 1
1.1　Flutter初始項目分析 1
1.1.1　Flutter初始項目結(jié)構(gòu) 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　片段代碼和快速重構(gòu) 12
1.3.3　三個基礎(chǔ)知識QA 14
1.4　Widget知識儲備 15
1.4.1　命令式UI編程與聲明式UI編程 16
1.4.2　認(rèn)識Widget體系 16
1.4.3　Widget源碼初識 18
1.4.4　組件的提取抽離 21

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

Day 3　界面風(fēng)格和簡單繪制 39
3.1　Material風(fēng)格 40
3.1.1　Scaffold和BottomNavigationBar 40
3.1.2 TabBar和TabBarView 41
3.1.3 標(biāo)題欄按鈕和菜單組件 42
3.1.4 彈出對話框 43
3.1.5 界面的左右滑頁 43
3.1.6 showSnackBar和showBottomSheet 44
3.2 Cupertino風(fēng)格 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　認(rèn)識CustomPainter繪制 49
3.3.1　繪制網(wǎng)格 49
3.3.2 Canvas初級繪制 50
3.3.3 移植繪制n角星 52
3.3.4 移植繪制粒子數(shù)字 54

Day 4　基礎(chǔ)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 圖片的適應(yīng)模式 62
4.2.3 圖片顏色及混合模式 63
4.2.4 圖片對齊模式及重復(fù)模式 63
4.2.5 用centerSlice實現(xiàn)圖片局部放大 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的構(gòu)造及分隔線 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　網(wǎng)格組件GridView 97
5.4　Sliver家族 99
5.4.1　SliverAppBar的使用 100
5.4.2　Sliver中的列表布局、網(wǎng)格布局及普通布局 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　路由與導(dǎo)航 122
6.3.1　打開路由 122
6.3.2　路由的傳參 125
6.3.3　路由的跳轉(zhuǎn)動畫 128
6.3.4　Hero跳轉(zhuǎn)動畫 130

Day 7　手勢組件與自定義組件 132
7.1　手勢組件與使用 132
7.1.1　InkWell水波紋的使用 132
7.1.2　GestureDetector的使用 133
7.1.3　手寫板的實現(xiàn) 135
7.2　根據(jù)現(xiàn)有組件實現(xiàn)自定義組件 137
7.2.1　切換Widget組件 137
7.2.2　顏色選擇圓鈕組件ColorChooser 139
7.2.3　函數(shù)運動組件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　認(rèn)識三棵樹 153
8.1.1　漫談Widget、Element、RenderObject
8.1.2　認(rèn)識RenderObject和Element
8.1.3　三棵樹結(jié)構(gòu)
8.1.4　三個根結(jié)點的初始化
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的生命周期回調(diào)
8.3.2　State切換和跳轉(zhuǎn)時生命周期測試
8.3.3　setState做了什么

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

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

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

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　路徑插件和權(quán)限插件
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