[套装书]Flutter实战+React Native 精解与实战（2册）

1.3　搭建Flutter开发环境 14
1.3.1　安装Flutter 14
1.3.2　IDE配置与使用 19
1.3.3　连接设备运行Flutter应用 21
1.3.4　Android Studio常见配置问题 24
1.4　Dart语言简介 26
1.4.1　变量声明 27
1.4.2　函数 28
1.4.3　异步支持 30
1.4.4　Stream 34
1.4.5　Dart与Java及JavaScript的对比 35
第2章　第一个Flutter应用 36
2.1　计数器应用示例 36
2.1.1　创建Flutter应用模板 36
2.1.2　首页 39
2.2　路由管理 42
2.2.1　一个简单示例 43
2.2.2　MaterialPageRoute 44
2.2.3　Navigator 45
2.2.4　路由传值 45
2.2.5　命名路由 47
2.2.6　路由生成钩子 50
2.2.7　总结 50
2.3　包管理 51
2.4　资源管理 55
2.5　调试Flutter应用 60
2.6　Flutter异常捕获 67
2.6.1　Dart单线程模型 67
2.6.2　异常捕获 69
第3章　基础组件 73
3.1　Widget简介 73
3.1.1　概念 73
3.1.2　Widget与Element 73
3.1.3　Widget主要接口 74
3.1.4　StatelessWidget 75
3.1.5　StatefulWidget 77
3.1.6　State 78
3.1.7　在Widget树中获取State对象 84
3.1.8　Flutter SDK内置组件库介绍 85
3.2　状态管理 87
3.2.1　Widget管理自身状态 88
3.2.2　父Widget管理子Widget的状态 89
3.2.3　混合状态管理 91
3.2.4　全局状态管理 93
3.3　文本及样式 94
3.3.1　Text 94
3.3.2　TextStyle 95
3.3.3　TextSpan 95
3.3.4　DefaultTextStyle 96
3.3.5　字体 97
3.4　按钮 99
3.4.1　Material组件库中的按钮 99
3.4.2　自定义按钮外观 100
3.5　图片及ICON 102
3.5.1　图片 102
3.5.2　ICON 107
3.6　单选开关和复选框 109
3.6.1　属性及外观 110
3.6.2　总结 110
3.7　输入框及表单 110
3.7.1　TextField 110
3.7.2　Form 118
3.8　进度指示器 122
3.8.1　LinearProgressIndicator 122
3.8.2　CircularProgressIndicator 123
3.8.3　自定义尺寸 124
3.8.4　颜色动画 125
3.8.5　自定义进度指示器样式 126
第4章　布局类组件 127
4.1　布局类组件简介 127
4.2　线性布局（Row和Column） 128
4.3　弹性布局（Flex） 133
4.4　流式布局 136
4.4.1　Wrap 136
4.4.2　Flow 137
4.5　层叠布局 139
4.6　对齐与相对定位（Align） 141
4.6.1　Align 142
4.6.2　Align与Stack对比 144
4.6.3　Center组件 145
第5章　容器类组件 146
5.1　填充（Padding） 146
5.2　尺寸限制类容器 147
5.2.1　ConstrainedBox 147
5.2.2　SizedBox 148
5.2.3　多重限制 149
5.2.4　UnconstrainedBox 150
5.2.5　其他尺寸限制类容器 152
5.3　装饰容器（DecoratedBox） 152
5.4　变换（Transform） 153
5.5　Container 156
5.6　Scaffold、AppBar和底部导航 158
5.6.1　Scaffold 158
5.6.2　AppBar 160
5.6.3　抽屉菜单 163
5.6.4　FloatingActionButton 165
5.6.5　底部导航栏 165
5.7　剪裁（Clip） 166
第6章　可滚动组件 169
6.1　可滚动组件简介 169
6.2　SingleChildScrollView 171
6.3　ListView 172
6.4　GridView 179
6.5　CustomScrollView 184
6.6　滚动监听及控制 187
6.6.1　ScrollController 187
6.6.2　滚动监听 191
第7章　功能型组件 194
7.1　导航返回拦截（WillPopScope） 194
7.2　数据共享（InheritedWidget） 195
7.3　跨组件状态共享（Provider） 200
7.4　颜色和主题 210
7.4.1　颜色 210
7.4.2　主题 212
7.5　异步UI更新 215
7.5.1　FutureBuilder 216
7.5.2　StreamBuilder 218
7.6　对话框详解 219
7.6.1　使用对话框 219
7.6.2　打开动画及遮罩 224
7.6.3　对话框实现原理 226
7.6.4　对话框状态管理 227
7.6.5　其他类型的对话框 235
第二篇　进阶篇
第8章　事件处理与通知 242
8.1　原始指针事件处理 242
8.2　手势识别 245
8.2.1　GestureDetector 245
8.2.2　GestureRecognizer 249
8.2.3　手势竞争与冲突 251
8.3　事件总线 253
8.4　Notification 255
第9章　动画 261
9.1　Flutter动画简介 261
9.2　动画基本结构及状态监听 265
9.2.1　动画基本结构 265
9.2.2　动画状态监听 270
9.3　自定义路由切换动画 270
9.4　Hero动画 273
9.5　交织动画 275
9.6　通用切换动画组件 278
9.6.1　AnimatedSwitcher 279
9.6.2　AnimatedSwitcher的高级用法 282
9.7　动画过渡组件 286
9.7.1　自定义动画过渡组件 286
9.7.2　Flutter预置的动画过渡组件 293
第10章　自定义组件 297
10.1　自定义组件方法简介 297
10.2　组合现有组件 298
10.3　组合实例：TurnBox 301
10.4　自绘组件（CustomPaint与Canvas） 305
10.5　自绘实例：圆形背景渐变进度条 309
第11章　文件操作与网络请求 318
11.1　文件操作 318
11.2　通过HttpClient发起HTTP请求 320
11.3　dio HTTP请求库 327
11.4　示例：HTTP分块下载 329
11.5　使用WebSockets 334
11.6　使用Socket API 338
11.7　JSON转Dart Model类 338
第12章　包与插件 348
12.1　开发Package 348
12.2　插件开发：平台通道简介 352
12.3　开发Flutter插件 355
12.4　插件开发：Android端API实现 357
12.5　插件开发：iOS端API实现 360
12.6　Texture和PlatformView 364
12.6.1　Texture（示例：使用摄像头） 364
12.6.2　PlatformView（示例：WebView） 373
第13章　国际化 375
13.1　让APP支持多语言 375
13.2　实现Localizations 379
13.3　使用Intl包 381
13.4　国际化中的常见问题 386
第14章　Flutter核心原理 388
14.1　Flutter UI系统 388
14.2　Element与BuildContext 390
14.2.1　Element 390
14.2.2　BuildContext 391
14.3　RenderObject和RenderBox 395
14.3.1　布局过程 395
14.3.2　绘制过程 398
14.3.3　命中测试 401
14.3.4　语义化 402
14.3.5　总结 403
14.4　Flutter运行机制：从启动到显示 403
14.5　图片加载原理与缓存 410
14.5.1　ImageProvider 410
14.5.2　Image组件原理 418
第三篇　实例篇
第15章　一个完整的Flutter应用 422
15.1　GitHub客户端示例 422
15.2　Flutter APP代码结构 423
15.3　Model类定义 424
15.4　全局变量及共享状态 427
15.4.1　全局变量：Global类 427
15.4.2　共享状态 428
15.5　网络请求封装 430
15.5.1　网络接口缓存 430
15.5.2　封装网络请求 433
15.6　APP入口及主页 435
15.6.1　APP入口 435
15.6.2　主页 437
15.6.3　抽屉菜单 443
15.7　登录页 446
15.8　多语言和多主题 449
15.8.1　语言选择页 449
15.8.2　主题选择页 451
参考文献 452



---------------------------React Native 精解与实战---------------------------


前言
第Ⅰ部分　入门
第1章　React与React Native简介2
1.1　React简介2
1.2　React Native 简介9
1.3　React Native 前置知识点11
第2章　Node.js 简介与开发环境配置13
2.1　Node.js与npm简介13
2.2　React Native开发环境配置15
2.2.1　安装Node.js16
2.2.2　安装React Native18
2.2.3　代码编辑器以及推荐插件22
第3章　React Native工作原理与生命周期25
3.1　React Native框架及工作原理25
3.1.1　React Native与原生平台通信27
3.1.2　组件间通信27
3.2　React Native中的生命周期31
3.3　本章小结35
第4章　React Native页面布局36
4.1　CSS 3简介36
4.2　Flex弹性盒模型37
4.3　Flex属性详解与实例39
4.3.1　justify-content属性40
4.3.2　align-items属性42
4.3.3　align-self 属性45
4.3.4　flex-direction 属性48
4.3.5　flex-basis属性51
4.3.6　flex-wrap属性52
4.3.7　align-content 属性54
4.3.8　flex-grow 属性58
4.3.9　flex-shrink 属性60
4.3.10　order属性63
4.3.11　flex-flow属性64
4.3.12　flex属性64
4.4　React Native中的Flex属性65
4.5　本章小结65
第5章　React Native开发调试技巧与工具66
5.1　配置iOS开发环境66
5.2　配置 Android 开发环境70
5.3　常用调试属性的说明73
5.4　Chrome 中远程调试代码77
5.5　React Developer Tools 工具安装与应用80
5.6　本章小结82
第6章　React Native 组件详解83
6.1　React Native组件简介83
6.2　视图组件86
6.2.1　View组件介绍86
6.2.2　View组件实例87
6.3　底部导航 TabBar 组件92
6.3.1　TabBar 组件介绍92
6.3.2　iOS平台下TabBarIOS组件实例94
6.3.3　Android 平台下TabBar组件实例99
6.4　iOS 与 Android 的页面跳转102
6.4.1　NavigatorIOS 组件介绍102
6.4.2　NavigatorIOS组件实例104
6.4.3　react-native-navigation组件介绍108
6.4.4　react-native-navigation组件实例110
6.5　Image组件111
6.5.1　Image组件介绍111
6.5.2　Image组件实例112
6.6　Text组件114
6.6.1　Text组件介绍114
6.6.2　Text组件基本使用116
6.6.3　Text组件嵌套117
6.6.4　Text组件样式统一119
6.7　TextInput 组件122
6.7.1　TextInput 组件介绍122
6.7.2　TextInput 组件实例124
6.8　触摸处理类组件130
6.8.1　TouchableHighlight 组件介绍130
6.8.2　TouchableHighlight 组件实例131
6.8.3　TouchableNativeFeedback 组件介绍132
6.8.4　TouchableNativeFeedback 组件实例133
6.8.5　TouchableOpacity组件介绍133
6.8.6　TouchableOpacity 组件实例134
6.8.7　TouchableWithoutFeedback组件介绍134
6.9　Web View组件135
6.9.1　WebView 组件介绍135
6.9.2　WebView 组件实例137
6.10　ScrollView组件139
6.10.1　ScrollView 组件介绍139
6.10.2　ScrollView组件实例140
6.11　本章小结142
第7章　React Native API详解143
7.1　React Native API简介143
7.2　提示框145
7.2.1　Alert 介绍145
7.2.2　Alert实例145
7.3　App运行状态150
7.3.1　AppState 介绍150
7.3.2　AppState 实例150
7.4　异步存储152
7.4.1　AsyncStorage 介绍152
7.4.2　AsyncStorage 实例154
7.4.3　登录状态处理159
7.5　相机与相册API161
7.5.1　CameraRoll介绍161
7.5.2　相册/相机组件实例161
7.6　地理位置信息168
7.6.1　Geolocation介绍168
7.6.2　Geolocation实例169
7.7　设备网络信息175
7.7.1　NetInfo介绍175
7.7.2　NetInfo实例175
7.8　本章小结178
第8章　React Native网络请求详解179
8.1　RESTful API 简介179
8.2　React Native 中的网络请求180
8.3　ListView 组件184
8.4　React Native 网络请求与列表绑定方案186
8.5　本章小结192
第9章　常用React Native开源组件详解193
9.1　React Native 热门资源列表194
9.2　React Native 接入微博、微信、QQ 登录196
9.3　更加美观的组件库200
9.4　React Native图表202
9.5　react-native-gifted-listview205
9.6　react-native-vector-icons207
9.7　本章小结210
第Ⅱ部分　进阶
第10章　React Native运行原理与部署调试214
10.1　React Native运行原理214
10.2　iOS平台部署与调试220
10.3　Android平台部署与调试225
10.4　Android模拟器简介230
10.5　本章小结233
第11章　iOS平台与React Native混合开发234
11.1　iOS平台混合开发简介234
11.2　iOS平台混合开发原理详解235
11.2.1　iOS原生代码实现235
11.2.2　iOS项目编译设置237
11.2.3　React Native中调用混合开发代码239
11.2.4　iOS平台混合开发特性详解241
11.3　iOS平台混合开发实例249
11.3.1　iOS原生代码实现249
11.3.2　React Native调用混合开发代码250
11.4　本章小结252
第12章　Android平台与React Native混合开发253
12.1　Android平台混合开发简介253
12.2　Android平台混合开发原理详解254
12.2.1　Android原生代码实现254
12.2.2　Android原生模块注册257
12.2.3　Android包定义258
12.2.4　React Native中调用混合开发代码260
12.2.5　Android平台混合开发特性详解263
12.3　Android平台混合开发实例270
12.3.1　Android原生代码实现270
12.3.2　Android包定义271
12.3.3　Android原生模块注册272
12.3.4　React Native调用混合开发代码273
12.4　本章小结276
第13章　React Native消息推送278
13.1　iOS平台消息推送机制278
13.2　Android平台消息推送机制282
13.3　React Native极光推送实战284
13.3.1　极光推送平台设置284
13.3.2　React Native插件安装与配置286
13.3.3　理解标签、别名、Registration ID概念289
13.3.4　React Native极光推送API与代码调用290
13.3.5　服务器端进行消息推送请求298
13.4　本章小结300
第14章　iOS、Android平台发布与热更新302
14.1　App图标与启动图302
14.2　快速生成所有平台App图标与启动图的方法308
14.3　iOS项目打包并上架AppStore310
14.4　Android平台打包与上架312
14.5　React Native热更新314
14.6　本章小结320
第15章　React Native性能调优方法与技巧321
15.1　性能调优基准参数321
15.2　常见造成App性能低下的原因323
15.3　查找性能问题以及调优方法326
15.4　性能优化方法与组件328
15.4.1　性能优化原则329
15.4.2　使用特定平台组件329
15.4.3　高性能第三方组件330
15.4.4　资源优化330
15.5　本章小结331
附录　React Native源码学习方法及其他资源332

.　　第三篇，实例篇（第15章），主要通过一个简化版的GitHub APP将前面介绍的各章内容结合起来，让开发者对完整的Flutter APP开发流程有一个总体了解。
　　由于Flutter的很多知识点都是相互交织的，很难将它们彻底划分开，所以本书中难免会出现一些在前面章节使用后面章节所介绍的知识点的情况，比如，我们在入门篇介绍进度指示器时会用到在进阶篇中才介绍的动画的相关知识。对于这种情况，书中会在相应的章节进行说明。读者既可以直接跳到后面了解相应知识点后再返回之前的章节，也可以先留一个印象，待逐步学习完后面相关章节之后再回顾一下前面的内容。
　　本书特色
　　我在大学期间读过侯捷（真名侯俊杰）老师所著的C++相关的一些书籍，在侯老师的《深入浅出MFC》一书中，有一句话令我印象非常深刻：“唯有深入，方能浅出。”我非常认同这句话，对于一门技术而言，只有对其了解得足够深入，才能用最浅显、通俗的话语将其描述出来。做到深入浅出就是本书的一个主要目标。所以，本书不仅是想告诉读者如何使用Flutter，而且也非常关注各个知识点的底层实现及其设计思想。从本书章节的划分上来看，入门篇为“浅出”，进阶篇则是“深入”。另外，由于PC客户端开发、移动开发、Web开发这些经验我都有，而Flutter本质上是一个UI系统，而UI系统的设计和实现在“大前端”下有很多相通之处，所以对于本书中的一些知识点，我也会对比着其他UI系统（主要是Android或Web）中相应的实现进行讲解，以便于有相关开发经验的读者理解。
　　读者对象
　　至少熟悉一种编程语言的读者。
　　接触过PC客户端、移动开发或Web前端开发的读者。
　　关于随书源码
　　由于篇幅所限，本书中的大多数示例代码都只展示部分核心代码，读者可以通过https://github.com/wendux/flutter_in_action_source_code 查看完整源码。
　　勘误
　　由于Flutter SDK仍在不断更新，本书中的部分内容（如类的继承关系、参数等）可能会与新版本的Flutter不一致，读者应以最新的Flutter SDK为准。另外，由于时间仓促，书中难免有错误之处，读者可以在本书GitHub项目issues列表中反馈，地址是https://github.com/flutterchina/flutter-in-action/issues。
　　致谢
　　感谢一直以来支持Flutter中文网、Flutter开源项目的朋友以及所有对本书提过意见和建议的读者，正是因为有你们的支持，才有了这本书。另外尤其感谢在线上打赏过本书的读者，你们的支持给了我很大的鼓励。
　　
　　
　　---------------------------React Native 精解与实战---------------------------
　　
　　
　　从2015年React Native框架发布开始，我就关注React Native框架的发展，在得知React Native框架将同时支持iOS平台与Android平台的部署后，我们就开始着手将之前的项目从混合开发的方式慢慢转移到使用React Native框架开发的方式上来。当时国内的React Native方面的资料非常少，很多难题的解决都需要查阅大量的国外文档，正是在这个摸索的过程中，加深了对React Native框架的理解。
　　后来，我们的很多Web项目都在使用React框架，React正是React Native最底层的技术框架，同时也深深体会到只有理解底层架构，才能对于很多表象的难题快速定位并找到解决方案。
　　本书基于我多年写的技术博客以及使用React Native框架的实战经验，我认为底层的原理永远比一些组件的使用方法更重要，所以本书介绍了大量框架底层原理。通过阅读本书你会发现掌握框架后，组件和API的使用将变得非常简单，希望你在学习时能体会到这种触类旁通的感觉。
　　本书主要内容
　　本书分为两大部分，第Ⅰ部分“入门”包括第1～9章，介绍React Native框架的基本原理与使用；第Ⅱ部分“进阶”包括第10～15章，介绍React Native框架的高阶开发与App部署相关知识。
　　第1章介绍React与React Native框架产生的背景与原理，以及开发优势。
　　第2章介绍Node.js框架，并实战演示了React Native开发环境的安装与配置。
　　第3章介绍React Native框架的构成、工作原理、组件间通信以及生命周期，包括代码实战演示。
　　第4章介绍React Native页面布局开发使用的CSS Flex，帮助读者掌握好React Native框架中元素布局的基本方法。
　　第5章介绍React Native框架下iOS平台与Android平台环境配置与代码调试的方法，并对React Native框架的调试工具以及借助Chrome进行远程调试的方法进行了实战讲解。
　　第6章介绍React Native框架中常用的组件，如View、TabBar、NavigatorIOS、Image、Text、TextInput、WebView、ScrollView等。同时介绍了iOS平台与Android平台的适配以及更适合的第三方组件。
　　第7章介绍React Native框架重点API的使用，包括提示框、App运行状态、异步存储、相机与相册、地理位置信息、设备网络信息等API，希望读者熟练掌握这些基础API，进而能举一反三。
　　第8章介绍React Native框架下的网络请求以及列表数据的绑定，这是开发App需要使用的技术重点。
　　第9章介绍React Native开发生态下一些常用的第三方组件，通过代码实战的方式进行讲解，并介绍了如何快速地找到自己的项目需要使用的第三方组件。
　　第10章结合iOS与Android平台深入讲解了React Native框架的底层运行原理，并分别介绍了两个平台的部署与测试方法。
　　第11章介绍React Native框架下iOS平台的混合开发方法，通过混合开发，你可以在React Native框架下访问任何iOS原生平台。
　　第12章介绍React Native框架下Android平台的混合开发方法，以及案例分析。
　　第13章详细讲解React Native框架下iOS平台与Android平台的消息推送原理，并介绍两个平台的消息推送实战。
　　第14章介绍项目最终打包前App的图标与启动图的设置，并介绍了如何通过第三方工具快速生成这些相关资源。
　　第15章介绍React Native性能调优的方法与技巧，以便在App上架前测试以及后期App遇到性能问题时可以快速定位到问题所在。
　　本书附录简单剖析了React Native的源码，希望能帮助你深入研究React Native框架的源码，以便能探究其底层本质。同时也分享了一些学习React Native框架的相关资源。
　　本书的读者对象
　　各类移动App开发人员，学习React Native框架可以使你开发一套React Native源码同时部署到iOS平台与Android平台。
　　想进入移动App开发领域的初学者，React Native框架比Android和iOS两个原生平台的技术门槛低很多，只需掌握HTML、CSS、JavaScript相关知识点就可以动手开发跨平台的移动App。
　　已经在使用React Native框架开发移动App的开发人员，书中讲解了React Native框架的底层原理，以及与iOS平台、Android平台的高阶混合开发部分，完全用代码进行讲解，学习起来更加直观。
　　本书配套源代码
　　本书的配套源代码都可以在https://github.com/ParryQiu/ReactNative-Book-Demo下载。
　　后续如果遇到React Native框架的大升级，我同样会在此代码库中相应地更新实战演示的代码。
　　致谢
　　首先感谢多年来共事过的同事们、领导们，多年来容忍我在一些技术问题上吹毛求疵，给了我很多好的建议和思路启发。还要感谢吴怡编辑，从约稿到审稿，都体现了她的认真态度和专业知识，她能一针见血地指出问题所在，促使我更加认真、专业地去编写此书。
　　在编写的过程中，虽然对于每一个知识点我都查阅了大量的相关文档，但是本书涉及海量的知识点，难免会有疏漏，恳请各位读者斧正。
　　邱鹏源
　　2018年 4月
　　

.　　本书完全按照实战课程的形式来讲解React Native。
　　本书在概念介绍部分着重分析React Native框架底层原理，让开发者不再惧怕React Native版本的频繁更新。
　　从React Native框架的基本原理与开发，到React Native框架的高阶开发以及应用部署，都结合代码进行实战讲解。
　　本书同时介绍了在实际项目开发中会经常使用到的第三方插件的原理与使用方法；
　　所有的实战重点代码都有详细的注释。
　　真正意义上的跨平台App实战，所有的知识点以及实战开发讲解都涵盖了iOS平台与Android平台。
　　本书中的复杂以及重要知识点，都有对应的视频课程讲解。
　　书籍配套源码托管在GitHub上，并随时根据React Native框架版本的更新而更新，确保读者可以学习到最新的代码实现。
　　书籍配套视频教程以及相关资源：http://rn.parryqiu.com/