React Native開發指南

前言 xi

第1章　初識React Native　1
1.1　React Native的優點　2
1.1.1　開發者體驗　2
1.1.2　代碼復用與知識共享　3
1.2　風險和缺點　4
1.3　小結　4

第2章　React Native工作原理　5
2.1　React Native是如何工作的　5
2.2　渲染周期　7
2.3　在React Native中創建組件　7
2.3.1　編寫視圖　7
2.3.2　使用JSX　9
2.3.3　原生組件的樣式　10
2.4　宿主平台接口　11
2.5　小結　12

第3章　構建你的第一個應用　13
3.1　搭建環境　13
3.1.1　安裝React Native　14
3.1.2　iOS依賴　14
3.1.3　Android依賴　14
3.2　創建一個新的應用　17
3.2.1　在iOS平台運行React Native應用　18
3.2.2　部署到iOS設備　20
3.2.3　在Android平台運行React Native應用　23
3.2.4　小結：創建並運行項目　24
3.3　探索示例代碼　24
3.3.1　添加組件到視圖中　24
3.3.2　React Native中的模塊導入　25
3.3.3　FirstProject組件　26
3.4　開發天氣應用　27
3.4.1　處理用戶輸入　28
3.4.2　展現數據　30
3.4.3　添加背景圖片　34
3.4.4　從Web獲取數據　36
3.4.5　整合　37
3.5小結　40

第4章　移動應用組件　42
4.1　類比HTML元素與原生組件　42
4.1.1　文本組件　43
4.1.2　圖片組件　45
4.2　處理觸摸和手勢　46
4.2.1　使用TouchableHighlight　47
4.2.2　GestureResponder系統　49
4.2.3　PanResponder　52
4.3　使用結構化組件　58
4.3.1　使用ListView　58
4.3.2　使用Navigator　66
4.3.3　其他結構化組件　68
4.4　平台特定組件　69
4.4.1　iOS或Android特定組件　69
4.4.2　平台特定版本的組件　70
4.4.3　何時使用平台特定組件　74
4.5　小結　74

第5章　樣式　75
5.1　聲明和操作樣式　75
5.1.1　內聯樣式　76
5.1.2　對象樣式　76
5.1.3　使用Stylesheet.Create　77
5.1.4　樣式拼接　77
5.2　組織和繼承　79
5.2.1　導出樣式對象　79
5.2.2　樣式作為屬性傳遞　80
5.2.3　復用和共享樣式　81
5.3　定位和設計布局　81
5.3.1　使用flexbox布局　82
5.3.2　使用絕對定位　86
5.3.3　學以致用　86
5.4　小結　91

第6章　平台接口　92
6.1　使用定位接口　93
6.1.1　獲取用戶地理位置　93
6.1.2　處理權限問題　94
6.1.3　在iOS模擬器上測試定位　95
6.1.4　監聽用戶位置　96
6.1.5　限制　96
6.1.6　改進天氣應用　96
6.2　使用用戶圖片與攝像頭　99
6.2.1　相機模塊　99
6.2.2　通過getPhotoParams獲取圖片　101
6.2.3　從相機渲染一張圖片　101
6.2.4　展示照片列表　103
6.2.5　上傳圖片至服務器　107
6.3　AsyncStore持久化數據存儲　108
6.4　智能天氣應用　109
6.4.1　WeatherProject組件　111
6.4.2　Forecast組件　114
6.4.3　Button組件　115
6.4.4　LocationButton組件　116
6.4.5　PhotoBackdrop組件　117
6.5　小結　119

第7章　模塊　120
7.1　使用npm安裝JavaScript類庫　120
7.2　iOS原生模塊　121
7.2.1　導入第三方組件　122
7.2.2　使用視頻組件　125
7.2.3　剖析Objective-C原生模塊　125
7.2.4　RCTVideo的實現　128
7.3　Android原生模塊　130
7.3.1　安裝第三方組件　130
7.3.2　剖析Java原生模塊　134
7.3.3　LinearGradient的Android實現　137
7.4　跨平台原生模塊　139
7.5　小結　141

第8章　調試與開發者工具　142
8.1　JavaScript調試實踐和解釋　142
8.1.1　激活開發者選項　142
8.1.2　使用console.log調試　143
8.1.3　使用JavaScript調試器　145
8.1.4　使用React開發者工具　146
8.2　React Native調試工具　147
8.2.1　使用審查元素功能　147
8.2.2　宕機紅屏　148
8.3　JavaScript之外的調試方法　152
8.3.1　常見的開發環境問題　153
8.3.2　常見的Xcode問題　153
8.3.3　常見的Android問題　154
8.3.4　React Native包管理器　155
8.3.5　部署至iOS設備的問題　156
8.3.6　模擬器行為　157
8.4　測試代碼　158
8.4.1　使用Flow進行類型檢查　158
8.4.2　使用Jest進行測試　158
8.5　當你陷入困境　160
8.6　小結　160

第9章　學以致用　161
9.1　閃卡應用　161
9.1.1　項目結構　163
9.1.2　組件層次結構　164
9.2　模型與數據存儲　168
9.2.1　數據流架構：Reflux與Flux　170
9.2.2　在Zebreto中使用Reflux　173
9.2.3　AsyncStorage與Reflux Store的持久化　175
9.3　使用Navigator　177
9.4　探索第三方依賴　180
9.5　響應式設計與字體尺寸　180
9.6　小結及任務　183

第10章　部署至iOS應用商店　184
10.1　准備Xcode工程　184
10.1.1　選擇支持的設備和目標iOS版本　185
10.1.2　啟動界面圖像　186
10.1.3　添加應用圖標　188
10.1.4　設置Bundle名稱　190
10.1.5　更新AppDelegate.m　190
10.1.6　為發布設置Schema　191
10.2　上傳應用　192
10.2.1　完成協議文書　192
10.2.2　創建歸檔　193
10.2.3　在iTunes Connect上創建應用　196
10.3　使用TestFlight進行Beta測試　199
10.4　提交應用審核　200
10.5　小結　201

第11章　部署Android應用　203
11.1　設置應用圖標　203
11.2　生成release版本的APK　205
11.3　通過郵件或鏈接發布　207
11.4　提交應用至Play商店　207
11.4.1　通過Play Store進行Beta測試　209
11.4.2　Play商店列表　210
11.4.3　商店列表所需的資源　211
11.4.4　發布應用　212
11.5　小結　214

總結　215
附錄A　ES6語法　216
附錄B　命令與快速入門指南　219
作者簡介　221
關於封面　221