准备前工作：
1、RN环境（python2、nodejs）
2、使用AndroidStudio创建好一个Demo工程
一、基础文件添加
1、package.json文件添加
这个文件可以从已有的RN项目里面copy到Demo工程根目录下，也可以自己新建一个空白的package.json文件，粘贴下面的代码：
注意：name替换成自己的项目名
{
"name": "HelloRN",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"react": "16.0.0-alpha.12",
"react-native": "0.47.2"
},
"devDependencies": {
"babel-jest": "20.0.3",
"babel-preset-react-native": "3.0.1",
"jest": "20.0.4",
"react-test-renderer": "16.0.0-alpha.12"
},
"jest": {
"preset": "react-native"
}
}
2、index.android.js文件添加
这个文件是添加在项目根目录下，可以直接从已有RN项目里面cooy过来，或者自己新建index.android.js，粘贴下面的代码(代码来源官网的HelloWorld)：
import React, { Component } from 'react';
import { AppRegistry, Text } from 'react-native';
class HelloWorldApp extends Component {
render() {
return (
<Text>Hello world!</Text>
);
}
}
// 注意，这里用引号括起来的'HelloWorldApp'必须和你init创建的项目名一致
AppRegistry.registerComponent('HelloWorldApp', () => HelloWorldApp);
二、安装npm模块
使用AndroidStudio自带的命令行，输入npm install，执行完成后，会在根目录看到新增node_modules文件
三、依赖添加
1、根目录的build.gradle文件
在allprojects节点下，添加如下代码：
maven {
url "$rootDir/node_modules/react-native/android"
}
2、主moudle的build.gradle文件
dependencies节点下添加：compile "com.facebook.react:react-native:+" // From node_modules;
也就是我们平时添加依赖的地方
dependencies {
...
compile "com.facebook.react:react-native:+" // From node_modules
...
}
四、代码部分修改
前提：完成上面的步骤，重新编译通过(否则下面会出现找不到类)
1、Application
项目的Application需要实现RNReactApplication接口
注意：下面BuildConfig要导入自己项目包名下的，不要导成了faceBook或者其他lib库的
public class HelloRnApplication extends Application implements ReactApplication {
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
@Override
public boolean getUseDeveloperSupport() {
//注意：BuildConfig需要导入自己项目包名下的BuildConfig
return BuildConfig.DEBUG;
}
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage()
);
}
};
@Override
public ReactNativeHost getReactNativeHost() {
return mReactNativeHost;
}
@Override
public void onCreate() {
super.onCreate();
SoLoader.init(this, /* native exopackage */ false);
}
}
如果没配置Application的，还需要到AndroidManifest.xml文件中完成配置：
2、Activity
需要继承自ReactActivity，或者网上也方案实现DefaultHardwareBackBtnHandler接口也可以
public class ReactNativeActivity extends ReactActivity {
/**
* Returns the name of the main component registered from JavaScript.
* This is used to schedule rendering of the component.
*/
@Override
protected String getMainComponentName() {
return "HelloRN";
}
}
3、AndroidManifest.xml
增加两项权限
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
五、启动npm服务
进入到项目的工作空间目录，ctrl+鼠标右键，在此处打开命令行，执行react-native start指令，启动npm服务端
六、效果
项目运行到模拟器上，就完成了
