第1章 React Native 1
1.1 React Native開發特點 2
1.1.1 一次學習,隨處編寫 2
1.1.2 混閤開發 2
1.1.3 高效的移動應用開發 3
1.1.4 高效的移動應用開發調試 4
1.1.5 靈活高效的應用熱更新 4
1.1.6 有效降低移動應用安裝包體積 5
1.1.7 學習門檻低、開發難度低 5
1.1.8 開發軟硬件要求低 6
1.1.9 使用React Native開發的代價 6
1.2 React Native開發環境搭建 7
1.2.1 開發環境搭建起點 8
1.2.2 Windows操作係統下React Native開發環境搭建 8
1.2.3 蘋果操作係統下React Native開發環境搭建 10
1.2.4 查看與刪除使用npm命令安裝的軟件 11
1.3 代碼編輯環境搭建 11
1.3.1 Visual Studio Code 11
1.3.2 Sublime Text 3 11
1.3.4 WebStorm 13
1.4 鍵盤使用習慣 13
1.5 React Dev Tools安裝 14
第2章 狀態機思維與狀態機變量 17
2.1 初始化項目 17
2.1.1 初始化RN最新版項目 17
2.1.2 初始化RN舊版本項目 18
2.2 運行項目 19
2.2.1 使用Android手機調測準備事項 19
2.2.2 第一次運行Android平颱RN項目 19
2.2.3 再次在Android平颱運行RN項目 21
2.2.4 使用iPhone設備調試注意事項 22
2.2.5 首次在iOS平颱運行RN項目 23
2.2.6 再次在iOS平颱運行RN項目 27
2.2.7 Sublime Text 3對JSX語法的支持 27
2.2.8 修改JSX代碼 28
2.2.9 啓動調試工具 30
2.2.10 使用ADM工具調試 35
2.3 構建登錄頁麵 37
2.4 React Native代碼執行邏輯 41
2.5 UI框架工作基本機製 41
2.5.1 狀態機思維 42
2.5.2 “冒充常量”的狀態機變量 44
2.5.3 “無處安放”的狀態機變量 45
2.5.4 “努力瘦身”的狀態機變量 46
2.6 React Native組件間通信 46
2.7 深入理解UI重新渲染的過程 47
2.7.1 閤並狀態機變量 47
2.7.2 判斷是否渲染 49
2.7.3 強製啓動渲染 50
2.7.4 渲染過程 50
2.7.5 閤並狀態機變量的最簡語法 50
2.8 React Native組件的成員變量 51
2.9 React Native組件的靜態變量、靜態函數 52
2.10 組件迴調函數的綁定 52
第3章 頁麵導航、彈齣框及深入理解屬性 55
3.1 分離注冊組件、組件平颱自適配 55
3.1.1 分離注冊組件 55
3.1.2 組件平颱自適配 55
3.1.3 平颱檢測 56
3.2 導航組件、掛接注冊組件 56
3.3 掛接注冊等待組件 58
3.4 Navigator組件 61
3.4.1 push與pop 61
3.4.2 replace函數 62
3.5 React Native中顔色類型的值 62
3.6 BackAndroid API 63
3.7 屬性確認 63
3.8 指定屬性默認值 66
3.9 Alert應用程序編程接口 66
3.9.1 彈齣確認框 66
3.9.2 彈齣選擇框 67
3.10 帶導航欄的頁麵導航 69
第4章 混閤開發基礎篇 70
4.1 iOS平颱混閤開發 70
4.1.1 與iOS 側原生代碼消息互通 71
4.1.2 React Native代碼到iOS原生代碼的消息 72
4.1.3 iOS 原生代碼到React Native代碼的消息 75
4.1.4 與iOS OC原生代碼界麵切換 77
4.1.5 應用初始界麵設定 77
4.1.6 iOS混閤開發中傳遞的參數類型 78
4.1.7 混閤開發中的多綫程使用 78
4.1.8 原生代碼實現Promise機製 79
4.1.9 跨語言常量 82
4.2 Android平颱混閤開發 82
4.2.1 與Android原生代碼消息互通 83
4.2.2 React Native代碼到Android原生代碼的消息 84
4.2.3 與Android原生代碼界麵的切換 87
4.2.4 Android原生代碼到React Native代碼的消息 91
4.2.5 應用初始界麵設定 94
4.2.6 傳遞的參數類型 94
4.2.7 迴調函數與Promise機製 95
4.2.8 監聽ActivityResult與Android生命周期事件 97
4.2.9 混閤開發中的多綫程機製 98
4.2.10 跨語言常量 98
第5章 flexbox布局、View、Image與可觸摸組件 100
5.1 flexbox布局 100
5.1.1 位置及寬、高相關樣式鍵 102
5.1.2 決定子組件排列規則的鍵 102
5.1.3 決定組件顯示規則的鍵 106
5.1.4 邊框、空隙與填充 109
5.1.5 zIndex 110
5.1.6 組件多樣式聲明與動態樣式聲明 110
5.2 View組件 111
5.2.1 View組件的顔色與邊框 111
5.2.2 View組件的陰影與其他視覺效果 113
5.2.3 View組件的變形 114
5.2.4 View組件的迴調函數 117
5.2.5 View組件的其他屬性 119
5.2.6 設備放置狀態、根View與onLayout迴調函數 120
5.2.7 pointerEvents屬性 123
5.3 Image組件 125
5.3.1 加載網絡圖片 125
5.3.2 加載靜態圖片資源 127
5.3.3 加載資源文件中的圖片 128
5.3.4 動態加載手機中的圖片資源 129
5.3.5 Image組件的樣式 129
5.3.6 Image組件顯示特性 131
5.3.7 Image組件的其他屬性 134
5.3.8 Image組件的緩存 134
5.3.9 盡量使用網絡圖片 135
5.4 可觸摸組件 135
5.4.1 可觸摸組件類型 135
5.4.2 TouchableOpacity組件 136
5.4.3 TouchableHighlight組件 137
5.4.4 其他屬性 138
5.5 使用導航欄的導航框架 139
5.5.1 導航欄自定義組件的實現 140
5.5.2 調用自定義組件 142
第6章 Text、TextInput等相關知識 145
6.1 Text組件 145
6.1.1 樣式鍵設置 145
6.1.2 其他屬性 147
6.1.3 Text組件的嵌套 149
6.1.4 文本顯示的陰影效果 150
6.1.5 Text居中顯示 151
6.1.6 在字符串中插入圖像 153
6.2 Text組件在兩個平颱上的不同錶現 155
6.2.1 隻指定fontSize,不指定height 155
6.2.2 隻指定height,不指定fontSize 156
6.2.3 fontSize等於height 156
6.2.4 height大於fontSize 156
6.2.5 邊框在兩個平颱上的不同錶現 157
6.3 TextInput組件 158
6.3.1 TextInput組件樣式鍵 158
6.3.2 TextInput組件的屬性 158
6.3.3 TextInput組件iOS平颱專有屬性 160
6.3.4 TextInput組件Android平颱專有屬性 161
6.3.5 TextInput組件的成員函數 161
6.4 TextInput組件在兩個平颱上的不同錶現 161
6.4.1 Android平颱的輸入下畫綫 162
6.4.2 父組件的alignItems鍵失效 162
6.4.3 隻指定fontSize,不指定height 164
6.4.4 height等於fontSize 164
6.4.5 height大於fontSize 164
6.4.6 邊框在兩個平颱上的不同錶現 165
6.5 TextInput組件的生命周期 165
6.5.1 獲得焦點 165
6.5.2 用戶輸入 166
6.5.3 用戶按下提交鍵 166
6.5.4 失去焦點 166
6.5.5 生命周期中的其他事件 167
6.6 Keyboard API、軟鍵盤與鍵盤事件 168
6.6.1 Keyboard API 168
6.6.2 鍵盤事件處理例程 168
6.7 組件的引用 171
6.7.1 定義組件引用 171
6.7.2 得到係統定義的組件引用 171
6.7.3 調用組件的公開成員函數 172
6.7.4 重新設定組件的屬性 172
6.7.5 獲得組件的位置 174
6.8 跨平颱狀態欄組件 175
6.8.1 StatusBar組件屬性 175
6.8.2 StatusBar組件使用示例 176
6.8.3 手機狀態欄在開發中的處理 176
6.9 高度自增長的擴展TextInput組件 177
6.10 訪問操作係統剪貼闆 179
第7章 組件生命周期、數據存儲及React Native應用實現步驟 182
7.1 組件生命周期 182
7.1.1 constructor 182
7.1.2 componentWillMount 182
7.1.3 componentDidMount 183
7.1.4 componentWillReceiveProps 183
7.1.5 shouldComponentUpdate 183
7.1.6 componentWillUpdate 184
7.1.7 componentDidUpdate 184
7.1.8 componentWillUnmount 184
7.2 讀取JSON文件 185
7.3 數據持久化操作 186
7.3.1 寫入數據、錯誤捕捉 186
7.3.2 讀取數據 188
7.3.3 AsyncStorage API存儲數據的無序性 190
7.3.4 刪除數據 191
7.3.5 修改數據 192
7.3.6 JSON對象存儲 192
7.3.7 讀取JSON對象 193
7.4 數據錶操作 193
7.5 React Native應用實現步驟、日記例程(上) 193
7.5.1 應用原型 194
7.5.2 基礎組件結構設計 195
7.5.3 使用React Native組件搭建靜態界麵 197
7.5.4 React Native組件分層 204
7.5.5 實現各組件業務邏輯 206
7.5.6 日記例程(上)總結 206
第8章 ScrollView和ListView 218
8.1 ScrollView組件 218
8.1.1 ScrollView組件屬性 218
8.1.2 ScrollView組件iOS平颱專有屬性 219
8.1.3 ScrollView組件Android平颱專有屬性 220
8.1.4 ScrollView組件的公開成員函數 221
8.1.5 RefreshControl組件 221
8.1.6 ScrollView組件基本用法 222
8.2 ListView組件 224
8.2.1 ListView組件的迴調函數 225
8.2.2 ListView組件的其他屬性 226
8.2.3 ListView組件的成員函數 226
8.3 簡單的列錶 226
8.3.1 準備列錶的數據源 227
8.3.2 聲明狀態機變量 227
8.3.3 將數據源中的數據復製到DataSource中 228
8.3.4 定義如何渲染列錶中的每一行 228
8.3.5 實現簡單的列錶 229
8.3.6 列錶欄的高級處理 237
8.4 帶分段標誌的列錶 237
8.4.1 準備數據源 238
8.4.2 聲明狀態機變量 238
8.4.3 將數據源中的數據復製到DataSource中 239
8.4.4 定義如何渲染每個分欄 240
8.4.5 定義如何渲染首、尾欄 240
8.4.6 列錶間隔渲染 240
8.4.7 實現帶分段標誌的列錶 241
8.4.8 總結 241
8.5 日記例程(下)總結 241
第9章 等待提示、進度條和Switch 242
9.1 ActivityIndicator組件 242
9.1.1 ActivityIndicator組件樣式設置 242
9.1.2 ActivityIndicator其他屬性 242
9.1.3 等待提示例程 242
9.2 iOS進度條組件 243
9.2.1 React Native框架中定時器的使用 243
9.2.2 ProgressViewIOS組件樣式設置 244
9.2.3 ProgressViewIOS其他屬性 244
9.2.4 iOS平颱進度條 245
9.3 Android平颱進度條組件 246
9.4 Switch組件 246
9.4.1 Switch組件樣式設置 246
9.4.2 Switch其他屬性 246
9.4.3 Switch組件的使用 247
第10章 導航組件與Modal 249
10.1 導航組件的屬性 249
10.1.1 迴調函數 249
10.1.2 其他屬性 250
10.2 導航器 250
10.3 NavigationBar 251
10.4 導航例程 252
10.5 Modal組件 257
10.6 Modal組件與Navigator組件的配閤 258
10.7 Modal組件例程 258
10.7.1 實現自定義Modal組件 258
10.7.2 使用自定義Modal組件 260
10.7.3 Modal組件與Alert組件 262
10.7.4 總結 262
第11章 手勢識彆 263
11.1 PanResponder API 263
11.2 監視器 263
11.2.1 指定監視區域 264
11.2.2 定義監視器相關變量 264
11.2.3 準備監視器的事件處理函數 264
11.2.4 建立監視器 265
11.2.5 將監視器與監視區域掛接 265
11.3 監視事件的生命周期 265
11.3.1 單次點擊事件的生命周期 266
11.3.2 單次點擊事件處理 268
11.3.3 移動手勢事件的生命周期 268
11.3.4 監視器異常事件 270
11.4 手勢識彆處理例程 270
11.4.1 單點手勢——點擊、拖動選擇百分比參數 270
11.4.2 單點手勢——帶導槽的滑動來電接聽或拒接界麵 273
11.4.3 單點手勢——滑動解鎖屏幕界麵 275
11.4.4 單點手勢——單點任意方嚮拉動選擇界麵 277
11.4.5 兩點手勢 281
第12章 網絡 282
12.1 獲取網絡狀態 282
12.1.1 得到當前網絡狀態 282
12.1.2 監聽網絡狀態改變事件 283
12.1.3 簡單判斷是否有網絡連接 284
12.1.4 判斷當前連接是否收費 284
12.2 搭建調試用HTTP、HTTPS服務器 284
12.2.1 搭建HTTP測試服務器 285
12.2.2 搭建HTTPS測試服務器 285
12.3 通過HTTP、HTTPS與網絡側交換數據 286
12.3.1 發送請求 286
12.3.2 接收響應 288
12.3.3 HTTP通信完整例程 290
12.3.4 使用HTTP消息嚮服務器上傳手機中的照片 291
12.4 在React Native開發中使用AJAX技術 291
12.5 WebSocket 292
12.5.1 WebSocket服務器的創建 292
12.5.2 在RN中使用WebSocket通信 293
12.6 推送 294
12.6.1 在Android平颱上使用推送技術 294
12.6.2 在iOS平颱上使用推送技術 295
12.7 Linking API 296
12.7.1 處理發給本應用的鏈接 296
12.7.2 打開外部鏈接 297
第13章 網頁瀏覽器、音視頻媒體播放 299
13.1 WebView組件樣式設置 299
13.2 WebView組件其他屬性 299
13.2.1 非迴調函數屬性 299
13.2.2 迴調函數屬性 300
13.2.3 平颱獨有屬性 300
13.2.4 WebView組件成員函數 301
13.3 網頁瀏覽器使用例程 301
13.3.1 瀏覽網頁例程 301
13.3.2 加載本地網頁例程 304
13.4 音視頻媒體播放 306
第14章 應用權限與圖庫操作 307
14.1 應用權限 307
14.1.1 iOS平颱應用權限 307
14.1.2 Android平颱應用權限 307
14.2 React Native開發中iOS平颱鏈接庫的使用 310
14.3 獲取手機中所有的圖片信息 312
14.4 圖片信息詳解 314
14.4.1 Android平颱圖片信息 314
14.4.2 iOS平颱圖片信息 315
14.5 顯示從CameraRoll API得到的圖片 315
14.6 為用戶提供圖片選擇界麵 316
14.7 圖片的保存與讀取顯示 318
14.7.1 保存圖片數據 319
14.7.2 讀取並顯示圖片 319
14.8 將圖片通過POST消息上傳 320
14.8.1 搭建配閤測試服務器 320
14.8.2 上傳圖片例程 320
14.9 裁剪圖片 323
14.9.1 裁剪圖片 323
14.9.2 使用裁剪後的圖片 324
第15章 選擇器、位置相關和應用狀態 325
15.1 日期、時間選擇器 325
15.1.1 DatePickerAndroid API 325
15.1.2 TimePickerAndroid API 327
15.1.3 DatePickerIOS組件 328
15.2 Picker組件 330
15.2.1 Picker組件的樣式設置 330
15.2.2 Picker組件的屬性 330
15.2.3 Picker.Item組件的屬性 331
15.2.4 Picker組件例程 331
15.3 PickerIOS 334
15.4 Slider組件 336
15.5 AppState API 338
15.5.1 AppState API的用途與用法 338
15.5.2 AppState API例程 338
15.6 獲取地理位置 339
15.7 Vibration API 340
15.7.1 Android平颱振動功能的實現 340
15.7.2 iOS平颱振動功能的實現 341
15.8 地圖功能 342
第16章 RN開源組件 343
16.1 微軟熱更新開源平颱——CodePush 343
16.1.1 安裝與注冊CodePush 343
16.1.2 CodePush相關命令 344
16.1.3 在RN項目中集成CodePush 345
16.1.4 CodePush使用注意事項 347
16.2 Google統計平颱——Google Analytics 348
16.2.1 Google統計能力 348
16.2.2 注冊Google統計賬號 351
16.2.3 在RN中使用Google統計 352
16.3 極光推送組件 352
16.4 數據存儲 352
16.4.1 Realm移動平颱 352
16.4.2 RN中文件操作 353
16.4.3 RN中數據庫操作 353
16.5 圖像處理 353
16.6 微信開發組件 354
16.7 支付寶支付組件 354
16.8 獲取設備信息 354
16.9 國際化處理 355
第17章 混閤開發高級篇 356
17.1 使用Objective-C語言創建私有的React Native組件 356
17.1.1 增加FLAnimatedImage鏈接庫 356
17.1.2 創建視圖管理類 358
17.1.3 封裝開源代碼中的視圖類 358
17.1.4 在React Native側調用私有組件 360
17.1.5 例程運行效果 362
17.2 使用Swift語言創建私有的React Native組件 363
17.2.1 整閤開源項目 363
17.2.2 建立組件管理者和橋接頭文件 366
17.2.3 Objective-C與React Native接口部分 367
17.2.4 使用Swift語言實現組件控製 368
17.2.5 在React Native側調用私有組件 370
17.2.6 例程運行效果 371
17.3 使用Android SDK創建私有的React Native組件 371
17.3.1 準備原生代碼UI組件 372
17.3.2 實現原生UI管理類 373
17.3.3 創建原生UI實例 374
17.3.4 實現對屬性的支持 374
17.3.5 建立原生UI包 374
17.3.6 注冊原生UI管理類 375
17.3.7 對應的React Native側實現 376
17.3.8 運行俯視視圖例程 377
第18章 項目配置、生成發布版本安裝包及其他 378
18.1 調試環境與正式運行環境的不同 378
18.2 iOS平颱項目配置 379
18.3 iOS平颱應用發布 383
18.4 Android平颱項目配置 383
18.5 Android平颱應用生成發布版本安裝包 385
18.5.1 生成發布密鑰 385
18.5.2 修改gradle配置文件 385
18.5.3 生成發布版本安裝包 386
18.6 其他組件與API 386
18.6.1 動畫相關 386
18.6.2 其他未討論的組件與API 387
附錄A ECMAScript 2015語法參考 388
附錄B ES 5語法 395
· · · · · · (
收起)