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　静态布局 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　动画状态监听和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　数据共享与状态管理 202
10.1　数据共享和参数传递 202
10.1.1　数据共享的传统实现方式
10.1.2　用InheritedWidget实现数据共享
10.2　状态管理的原始处理过程 207
10.2.1　数据准备与界面说明
10.2.2　FutureBuilder与StreamBuilder的使用
10.3　使用插件进行状态管理 213
10.3.1　BLoC对数据状态的管理
10.3.2　Provider对数据状态的管理
10.3.3　Redux对数据状态的管理

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　插件及混合开发 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的混合开发 264
12.3.1　Flutter和Android混合开发
12.3.2　Flutter和iOS混合开发
12.3.3　让Android视图加入Flutter