ReactNative嵌入到现有原生安卓应用

2019-11-09 18:43:41

字体：大中小

来源：转载

供稿：网友

嵌入到现有原生应用

简书：React Native起步－将RN嵌入到现有的Android应用中

CSDN：Android原生嵌入React Native 过程中遇见的各种坑

build.gradle

allPRojects { repositories { mavenLocal() jcenter() maven { // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm url "$rootDir/../reactNativeTest/node_modules/react-native/android" } }}

修改app/build.gradle

ndk { abiFilters "armeabi-v7a", "x86"}compile "com.facebook.react:react-native:+"

创建 ReactActivity

package com.cyb.reactnativetestproj;import android.app.Activity;import android.os.Bundle;import android.view.KeyEvent;import com.facebook.react.ReactInstanceManager;import com.facebook.react.ReactRootView;import com.facebook.react.common.LifecycleState;import com.facebook.react.modules.core.DefaultHardwareBackBtnHandler;import com.facebook.react.shell.MainReactPackage;/** * ReactNative * Created by cyb on 2016/11/26. */public class ReactActivity extends Activity implements DefaultHardwareBackBtnHandler{ private ReactRootView mReactRootView; private ReactInstanceManager mReactInstanceManager; @Override protected 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, "reactNativeTest", null); setContentView(mReactRootView); } @Override public void invokeDefaultOnBackPressed() { super.onBackPressed(); } @Override public void onBackPressed() { super.onBackPressed(); if(mReactInstanceManager != null){ mReactInstanceManager.onBackPressed(); } } @Override protected void onResume() { super.onResume(); if(mReactInstanceManager != null){ mReactInstanceManager.onHostResume(this, this); } } @Override protected void onPause() { super.onPause(); if(mReactInstanceManager != null){ mReactInstanceManager.onHostPause(this); } } @Override protected void onDestroy() { super.onDestroy(); if(mReactInstanceManager != null){ mReactInstanceManager.onHostDestroy(this); } } //我们需要改动一下开发者菜单。默认情况下，任何开发者菜单都可以通过摇晃或者设备类触发 // ，不过这对模拟器不是很有用。所以我们让它在按下Menu键的时候可以显示 @Override public boolean onKeyUp(int keyCode, KeyEvent event) { if(keyCode == KeyEvent.KEYCODE_MENU && mReactInstanceManager != null){ mReactInstanceManager.showDevOptionsDialog(); return true; } return super.onKeyUp(keyCode, event); }}

上一篇：初学者使用接口回调传值

下一篇：OkHttp的使用

学习交流

索泰发布一款GTX 1070 Mini迷你版本:小机

索泰发布一款GTX 1070 Mini迷你版本:小机箱大爱...

热门图片

猜你喜欢的新闻

猜你喜欢的关注