開發(fā)工具：WebStorm，Android Studio（下文簡稱AS）
開發(fā)React Native項(xiàng)目個(gè)人還是比較推薦WebStorm，它的操作界面以及快捷鍵跟AS如出一轍柔逼，對于Android開發(fā)者來說，使用這款I(lǐng)DE是極好的，哈哈腰湾。
作為一個(gè)剛開始寫技術(shù)文章的新手，謝謝各位的鼓勵(lì)與支持讨越。之所以取名為“特別篇”，其實(shí)主要內(nèi)容不多着逐，就是對以往兩篇文章的內(nèi)容進(jìn)行歸納與總結(jié)，本來打算寫關(guān)于Android生命周期組件的文章，但想想還是先把前幾天，欠下的內(nèi)容先補(bǔ)上锥咸，正所謂“打鐵要趁熱”弧轧，免得以后忘了，廢話說到這，開始今天的正文。
前言：
原生應(yīng)用中嵌入RN可以參考React Native官方中文文檔或者參考在Android原生應(yīng)用中嵌入React Native,在RN中調(diào)用Android原生方法可以參考React Native調(diào)用Android原生方法,本篇特別的地方就在于如果在Android原生應(yīng)用中接入RN,RN又要調(diào)用Android原生方法堕仔，用React Native調(diào)用Android原生方法里面的方式注冊并申明模塊的方法是行不通的，那篇文章方法只是適用于原來項(xiàng)目是RN項(xiàng)目。
一.原生應(yīng)用嵌入React Native 步驟：
1.創(chuàng)建RN的項(xiàng)目文件夾，在項(xiàng)目目錄里創(chuàng)建android文件夾你虹，并將原生Android項(xiàng)目代碼拷入/android中绘搞；
2.在RN項(xiàng)目文件夾中，創(chuàng)建一個(gè)名為package.json的文本文件傅物；
3.在RN項(xiàng)目目錄位置打開終端夯辖，運(yùn)行 npm install,安裝RN所需的服務(wù)；
4.AS中打開/android中安卓項(xiàng)目董饰，配置對于Maven以及依賴包蒿褂，在AndroidManifest.xml文件中添加Internet權(quán)限，以及需要配置添加的Activity界面卒暂；
具體方法參考：在Android原生應(yīng)用中嵌入React Native
二.RN調(diào)用Android原生方法 步驟：
1.創(chuàng)建模塊：新建Java Class 讓其繼承ReactContextBaseJavaModule并實(shí)現(xiàn)里面的方法啄栓；
2.注冊模塊：新建Java Class 實(shí)現(xiàn)ReactPackage里面的方法【RN官方文檔中有三個(gè)方法，最近發(fā)現(xiàn)只有兩個(gè)了】也祠；
3.然后將第二步創(chuàng)建Java Class加入到MainApplication.java文件的getPackages方法中昙楚；
4.RN中封裝模塊以及調(diào)用；
具體方法參考：React Native調(diào)用Android原生方法
區(qū)別：
原生Android項(xiàng)目引入RN界面诈嘿，在RN界面調(diào)用注冊好Android原生方法,創(chuàng)建以及注冊模塊方法堪旧，參考上文二步驟，但同時(shí)也要在上文步驟一的4方法中奖亚，展示React Native代碼界面的onCreate()方法中,將你創(chuàng)建的注冊模塊【上文二步驟方法2】添加到ReactInstanceManager.builder()中：
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mReactRootView = new ReactRootView(this);
mReactInstanceManager = ReactInstanceManager.builder()
.setApplication(getApplication())
.setBundleAssetName("index.android.bundle")
.setJSMainModuleName("index.android")
.addPackage(new MainReactPackage())
.addPackage(new AnExampleReactPackage())
.setUseDeveloperSupport(BuildConfig.DEBUG)
.setInitialLifecycleState(LifecycleState.RESUMED)
.build();
// 注意這里的MyReactNativeApp必須對應(yīng)“index.android.js”中的
// “AppRegistry.registerComponent()”的第一個(gè)參數(shù)
mReactRootView.startReactApplication(mReactInstanceManager, "ReactApp", null);
setContentView(mReactRootView);
}
注：上文.addPackage(new AnExampleReactPackage())【AnExampleReactPackage()類就是實(shí)現(xiàn)了ReactPackage接口】淳梦，同時(shí)AnExampleReactPackage()類也要加入MainApplication.java的ReactNativeHost中：
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
@Override
public boolean getUseDeveloperSupport() {
return BuildConfig.DEBUG;
}
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(), new AnExampleReactPackage()
);
}
};
@Override
public ReactNativeHost getReactNativeHost() {
return mReactNativeHost;
}
再AS中運(yùn)行項(xiàng)目，你會發(fā)現(xiàn)AS的日志貓里會有你再RN界面的中打印的log日志【以React Native調(diào)用Android原生方法中注冊的log為例子】
