这里我直接用AndroidStudio在桌面上创建了一个应用，名称为ReactNativeApp

在创建好的Android应用的build.gradle中，加入React Native的库：compile 'com.facebook.react:react-native:0.17.+'，如下图所示：

在AndroidManifest.xml文件中，需要加入访问网络的权限，然后还要注册一个Activity，这个Activity是React Native用来调试应用内置的一个Activity(com.facebook.react.devsupport.DevSettingsActivity)，如下图所示：

添加跟ReactNative相关的java代码，具体代码可以在上面的官方文档上找到，这里我直接把代码添加到MainActivity中了，如下代码所示：

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.KeyEvent;
import android.widget.Toast;import com.facebook.react.LifecycleState;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactRootView;
import com.facebook.react.modules.core.DefaultHardwareBackBtnHandler;
import com.facebook.react.shell.MainReactPackage;public class MainActivity extends AppCompatActivity implements DefaultHardwareBackBtnHandler {private ReactRootView mReactRootView;private ReactInstanceManager mReactInstanceManager;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);mReactRootView = new ReactRootView(this);mReactInstanceManager = ReactInstanceManager.builder().setApplication(getApplication()).setBundleAssetName("index.android.bundle").setJSMainModuleName("index.android").addPackage(new MainReactPackage()).setUseDeveloperSupport(BuildConfig.DEBUG).setInitialLifecycleState(LifecycleState.RESUMED).build();mReactRootView.startReactApplication(mReactInstanceManager, "helloworld", null);setContentView(mReactRootView);}@Overridepublic void invokeDefaultOnBackPressed() {super.onBackPressed();}@Overrideprotected void onPause() {super.onPause();if (mReactInstanceManager != null) {mReactInstanceManager.onPause();}}@Overrideprotected void onResume() {super.onResume();if (mReactInstanceManager != null) {mReactInstanceManager.onResume(this, this);}}@Overridepublic void onBackPressed() {if (mReactInstanceManager != null) {mReactInstanceManager.onBackPressed();} else {super.onBackPressed();}}@Overridepublic boolean onKeyUp(int keyCode, KeyEvent event) {if (keyCode == KeyEvent.KEYCODE_MENU && mReactInstanceManager != null) {mReactInstanceManager.showDevOptionsDialog();return true;}return super.onKeyUp(keyCode, event);}}

经过上面几个步骤，Android的代码基本上就配置好了，下面需要配置React Native相关的js代码。

在Windows的命令行下，进入我们第一步创建的android应用的根目录，然后依次执行下面几个命令：

npm init
npm install --save react-native
curl -o .flowconfig https://raw.githubusercontent.com/facebook/react-native/master/.flowconfig

执行npm init命令时，会让你输入一大堆的参数，这些可以直接回车，命令执行完毕后，会在当前目录下生成一个package.json文件；

执行npm install --save react-native命令时，会在当前目录下添加一个node模块，这个命令执行的时间会比较长，需要耐心等待下；

第三个命令是用curl执行的，在Windows上需要先安装curl，下载地址见这里： http://pan.baidu.com/share/link?shareid=2123553377&uk=4278509670下载完成后直接解压到硬盘某个目录，然后在环境变量的path中加入curl文件的路径，就可以直接在命令行中用curl命令了，有个问题是，如果直接执行上面的curl命令，可能会报错，这里我在-o参数前面加了-k参数后才执行成功。

执行完上面的三个命令后，在android应用的根目录下打开package.json文件，即上面npm init生成的那个文件，然后修改成如下内容：

{"name": "helloworld","version": "0.0.1","private": true,"scripts": {"start": "node_modules/react-native/packager/packager.sh"},"dependencies": {"react-native": "^0.12.0"}
}

修改完毕后，需要在android应用的根目录下添加一个index.android.js文件，在Activity中就会加载这个js文件显示UI，在这里我们直接使用官方文档上提供的demo，内容如下：

'use strict';var React = require('react-native');
var {Text,View
} = React;class MyAwesomeApp extends React.Component {render() {return (<View style={styles.container}><Text style={styles.hello}>Hello, World</Text></View>)}
}
var styles = React.StyleSheet.create({container: {flex: 1,justifyContent: 'center',},hello: {fontSize: 20,textAlign: 'center',margin: 10,},
});React.AppRegistry.registerComponent('helloworld', () => MyAwesomeApp);

这里需要注意一点，即上面代码的最后一行，React.AppRegistry.registerComponent('helloworld', () => MyAwesomeApp);这个函数的第一个参数应该跟我们java代码中的这一句：

mReactRootView.startReactApplication(mReactInstanceManager, "helloworld", null);

对应，如果不对应，加载就会出错。

到这里就可以启动服务器了，启动服务器的命令是：npm start，不过不知道为什么，我使用这个命令报错了，服务器并没有启动，所以我直接到node_modules/react-native/packager/目录下，执行了packager.sh命令，一样可以启动服务器，其实上面的package.json中配置的start，就是执行的packager.sh命令

打包运行Android应用

这时候需要配置下服务器的IP和端口，按手机的菜单键，然后选择Dev Settings选项，即出现开头我们在AndroidManifest.xml文件中配置的那个Activity，然后选择Debug sserver host & port for device那一项，在出来的对话框中，填写你的电脑的ip地址，默认端口是8081，注意：此时手机跟电脑应该在同一个局域网中。如下图所示：

这些都配置好了，就可以按菜单键，然后选择Reload JS重新加载js文件了，如果没其他问题的话，应该是可以在Activity中看到效果的，下面是一张效果图：

在使用小米手机的时候遇到一个坑：APP安装后，MIUI默认禁止了悬浮窗，导致我按菜单键时一直出不来React Native的调试对话框，这个对话框出不来就无法设置IP和端口，这里需要注意下，在应用权限管理中，应该允许我们的ReactNativeApp显示悬浮窗，如下图所示：

到这里基本上就告一段落了，在已有的Android项目中使用React Native，虽然官方文档上有详细介绍，但这个过程中依然存在很多坑，今天记录下来，希望给看到这篇博文的朋友一些帮助。