一、React native的簡要介紹
1、React native的設計思路
Android中具體的轉換流程：
ReactNative中把index.android.js編譯成Android工程目錄下assets里的index.android.bundle文件。
在Android中，導入的ReactNative的jar包中的代碼會根據這個bundle文件做相應的轉換，轉換成Android中“對應的代碼”去執行。
2、React native實現熱更新
React Native中的熱更新有點像App的版本更新，也就是根據查詢server端的版本和手機端目前App的版本進行對比，然后來執行是否更新的操作?？纯碦eact Native的加載啟動機制可知道：React Native會將一系列資源打包成js bundle文件，系統加載js bundle文件，解析并渲染。所以，React Native熱更新的根本原理就是更換js bundle文件，并重新加載，新的內容就能展示出來了
上面流程圖中展示了如何實現更新的步驟，可以總結為進入App根據版本檢查是否需要更新：
（1）更新：
下載最新JsBundle文件以及所需要的圖片資源等，下載完成后解析最新JsBundle文件。
（2）不更新：
判斷本地是否還有緩存的JsBundle文件：
1>存在：
本地存在JsBundle，即有過熱更新操作。那么App直接加載在緩存目錄下的JsBundle文件。
2>不存在：
本地不存在JsBundle，即之前從未有過熱更新操作。那么App只能使用初始化時打包在assets目錄下的index.android.bundle文件。
二、環境的搭建
參看react native中文網上搭建教程：http://bbs.reactnative.cn/topic/10/在windows下搭建react-native-android開發環境
需要安裝的軟件：JDK，Android SDK(Tools/Android SDK Build-tools (23.0.1)（這個必須版本嚴格匹配23.0.1）)，Python（必須為2.7.x版本），node.js（最高版本最好），這些軟件都要加到環境變量里面，并在cmd中運行（如果是window10系統，cmd命令行窗口要使用管理員模式打開），保證加入正確。
安裝react-native命令行工具：npm install -g react-native-cli
創建項目：在你想創建項目的目錄下如D:/，運行react-native init MyProject（MyProject就是項目的名字，隨意?。?，之后D盤目錄下就會有一個文件夾MyProject，里面就是最簡單的react native的程序
檢查新創建的項目是否能運行：
- 運行packager：react-native start，可以用瀏覽器訪問http://localhost:8081/index.android.bundle?platform=android看看是否可以看到打包后的腳本（看到很長的js代碼就對了）。第一次訪問通常需要十幾秒
- 另開啟一個命令行窗口，然后在工程目錄下（D:/MyProject）運行：react-native run-android，首次運行需要等待數分鐘并從網上下載gradle依賴。（這個過程屏幕上可能出現很多小數點，表示下載進度）
- 運行完畢后可以在真機上看到應用自動啟動了，但這時會是App紅屏報錯，左右搖晃手機，應用會彈出菜單，點擊Dev Settings，選Debug server host for device，輸入你的正在運行packager的那臺電腦的局域網IP加:8081，這時一定要保證防火墻是關閉的，否則會出現各種奇怪的錯誤，再按back鍵返回，再左右搖晃手機，在調試菜單中選擇Reload JS，就應該可以看到運行的結果了
三、集成到原生應用
在Android Studio中打開原生應用，要保證Terminal中運行grandle installDebug可以編譯通過，之后把編譯通過的原生應用復制到react native工程下的android目錄中（D:/MyProject/android）
A. 修改原生應用的build.gradle
- allprojectCompileSdkVersion和targetSdkVersion需要23或以上
- 添加依賴：
allprojects {
repositories {
jcenter()
maven {
//添加react native依賴，url路徑根據實際的來寫，本文的如下：
url "$rootDir/node_modules/react-native/android"
}
}
}
- 添加編譯庫：
dependencies {
...
compile "com.facebook.react:react-native:+"
}
- 編譯時，如果報出的錯誤為，找不到某個so的庫（其中有關鍵詞armeabi-v7a或armeabi），則表明原生應用引用的某個SDK所包含的so庫，是在armeabi-v7a這個目錄下，一個簡單的解決辦法就是，把原生應用中存放so庫的armeabi目錄復制一份并重命名為armeabi-v7a，然后在build.gradle中添加：
defaultConfig {
...
ndk {
abiFilters 'armeabi',"armeabi-v7a"
}
}
splits {
abi {
…
include "armeabi-v7a"
}
}
- 之后編譯工程，保證gradle修改的部分沒有問題，如果編譯時提示不能刪除build目錄下的文件，是因為正在運行packager服務器，需把他停掉
B. 添加原生Activity文件用于啟動JS
參考react native中文網“集成到現有原生應用” http://reactnative.cn/docs/0.48/integration-with-existing-apps.html#content，來創建ReactRootView對象，用于啟動react native應用(public class ReactNativeInAndroidActivity extends ReactActivity implements DefaultHardwareBackBtnHand)，同時在AndroidManifest.xml中添加此Activity并設定它的主題為Theme.AppCompat.Light.NoActionBar，添加權限
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
<uses-permission android:name="android.permission.SYSTEM_OVERLAY_WINDOW" />
添加react native可以彈出菜單的權限
<activity
android:name="com.facebook.react.devsupport.DevSettingsActivity" />
- 編譯并運行，啟動RN前端時，可能會紅屏報錯，關鍵字有bundle，在cmd命令行，進入到工程目錄下，運行
react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output D:/MyProject/android/原生應用啟動目錄/assets/index.android.bundle --assets-dest D:/MyProject/android/原生應用啟動目錄/res/
如果assets目錄下多了兩個文件index.android.bundle、index.android.bundle.meta，則表示成功，再次Reload JS
