缘起：
React Native出了有一段时间了，最近又有点时间，所以就打算简单了解一下。首先是IOS，React Native对IOS的支持还是很ok的。下边是代码：
NSURL *jsCodeLocation;
jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation moduleName:@"xxx" initialProperties:nil launchOptions:nil];123
这样创建rootView放那儿都可以。跟React Native号称的“只是一个View”情况差不多。在看看Android代码：
MainActivity.java
public class MainActivity 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 "LoveStudy";
}
}12345678910
MainApplication.java
public class MainApplication extends Application implements ReactApplication {
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
@Override
protected boolean getUseDeveloperSupport() {
return BuildConfig.DEBUG;
}
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage()
);
}
@Nullable
@Override
protected String getBundleAssetName() {
return "index.android.jsbundle";
}
};
@Override
public ReactNativeHost getReactNativeHost() {
return mReactNativeHost;
}1234567891011121314151617181920212223242526
这说好的view呢。要是第一次接触React Native真是吓了一跳。很纠结怎么能和自己先有的原生代码一起。网上搜一下一大把文章。比如：http://blog.csdn.net/keep_driving_xinyang/article/details/50290825。要是你又时间可以试试，应该遇到很多问题，要是没问题哪算你运气好。
解决办法：
当我搜了很多教程，然后还是出奇奇怪怪的问题。解决了一个出现另一个，最后没办法了才开始看ReactActivity的源码。不看不知道一看吓一跳，nnd 这玩意就是一个Demo，直接拿出来用就可以了 何必搞那么复杂。下边看看我的实现方式：
public class MainActivity extends Activity implements DefaultHardwareBackBtnHandler {
static final String TAG = "MainActivity";
private @Nullable
ReactInstanceManager mReactInstanceManager;
private @Nullable ReactRootView mReactRootView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mReactRootView = createRootView()；
mReactRootView.startReactApplication(
getReactNativeHost().getReactInstanceManager(),
"xxx",
null);
setContentView(mReactRootView);
}
protected ReactRootView createRootView() {
return new ReactRootView(this);
}
protected ReactNativeHost getReactNativeHost(){
// return mReactNativeHost;
return ((ReactApplication) getApplication()).getReactNativeHost();
}
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(getApplication()) {
@Override
protected boolean getUseDeveloperSupport() {
return BuildConfig.DEBUG;
}
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage()
);
}
@Nullable
@Override
protected String getBundleAssetName() {
//return super.getBundleAssetName();
return "index.android.bundle";
}
@Override
protected String getJSMainModuleName() {
//return super.getJSMainModuleName();
return "index.android";
}
};
@Override
protected void onDestroy() {
super.onDestroy();
if (mReactRootView != null) {
mReactRootView.unmountReactApplication();
mReactRootView = null;
}
mReactNativeHost.clear();
}
@Override
protected void onPause() {
super.onPause();
if (getReactNativeHost().hasInstance()) {
getReactNativeHost().getReactInstanceManager().onHostPause();
}
}
@Override
protected void onResume() {
super.onResume();
if (getReactNativeHost().hasInstance()) {
getReactNativeHost().getReactInstanceManager().onHostResume(this, this);
}
}
@Override
public void onBackPressed() {
if (getReactNativeHost().hasInstance()) {
getReactNativeHost().getReactInstanceManager().onBackPressed();
} else {
super.onBackPressed();
}
}
@Override
public void invokeDefaultOnBackPressed() {
super.onBackPressed();
}
}
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
上边基本上是简化版的ReactActivity，MainApplication.java中的代码就用Demo生成的应该没什么问题。getBundleAssetName（）函数中可以将你的本地名称给他就不会联网下载了，也可以做动态更新之类的。
在此我只想吐槽一下facebook这帮人，其实现在大多数用React Native的，我想都是试探性的，活着本来有一些功能是不能不用原生去实现的，而且React Native也号称只是一个View，哪你在Android里边吧mReactRootView隐藏起来干毛啊。直接拿ReactActivity当个demo多好。nnd看来人的想法真是不一样啊。
