从一个集成到现有的Android应用程序中的原生应用程序获取结果

我发现了很多关于如何整合反应本机到现有的Android应用程序的文章。 但是他们都没有解释如何从反应原生代码中得到结果,以便直接在Java android源代码中使用它。

解释:我有一个反应原生的应用程序,正在做一个特定的工作,并显示在一个popup窗口的结果。 我想集成这个应用程序(做必要的修改),以便能够将这个特定的结果放到我的android的Java源代码中,而不是将它显示在一个反应​​本地的popup窗口中。

我搜查了所有的互联网,但没有发现这一点。

Solutions Collecting From Web of "从一个集成到现有的Android应用程序中的原生应用程序获取结果"

为了从您开始的活动中获得结果,您的模块需要访问您的活动的参考。
这里有两个解决scheme:
– 将模块声明为活动的内部类
– 在模块的构造函数中传递您的活动的参考

但是,请记住,您的模块需要在ReactPackage ,而ReactPackage是一个接口,所以如果你想让你的ReactActivity实现接口(而不是创build一个新的类)。

这是一个使用inner class和实现ReactPackage的活动的完整工作示例:

 public class MyReactActivity extends AppCompatActivity implements DefaultHardwareBackBtnHandler, ReactPackage { 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()) // This activity is also a "ReactPackage" .addPackage(this) .setUseDeveloperSupport(BuildConfig.DEBUG) .setInitialLifecycleState(LifecycleState.RESUMED) .build(); mReactRootView.startReactApplication(mReactInstanceManager, "MyReactComponent", null); setContentView(mReactRootView); } @Override public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) { List<NativeModule> modules = new ArrayList<>(); // The module is added to the ReactPackage modules.add(new TestModule(reactContext)); return modules; } @Override public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) { return Collections.emptyList(); } // Module definition as an inner class public class TestModule extends ReactContextBaseJavaModule { public TestModule(ReactApplicationContext reactContext) { super(reactContext); } @Override public String getName() { return "TestModule"; } // The function you'll call from React Native @ReactMethod public void closewithresult(float datafromreact) { // Set a result Bundle bundle = new Bundle(); bundle.putFloat("result", datafromreact); setResult(Activity.RESULT_OK, (new Intent()).putExtras(bundle)); // Close the activity finish(); } } /* * Other overrided functions * (not relevant for this question) */ @Override public void invokeDefaultOnBackPressed() { super.onBackPressed(); } @Override protected void onPause() { super.onPause(); if (mReactInstanceManager != null) { mReactInstanceManager.onHostPause(this); } } @Override protected void onResume() { super.onResume(); if (mReactInstanceManager != null) { mReactInstanceManager.onHostResume(this, this); } } @Override protected void onDestroy() { super.onDestroy(); if (mReactInstanceManager != null) { mReactInstanceManager.onHostDestroy(this); } } @Override public void onBackPressed() { if (mReactInstanceManager != null) { mReactInstanceManager.onBackPressed(); } else { super.onBackPressed(); } } @Override public boolean onKeyUp(int keyCode, KeyEvent event) { if (keyCode == KeyEvent.KEYCODE_MENU && mReactInstanceManager != null) { mReactInstanceManager.showDevOptionsDialog(); return true; } return super.onKeyUp(keyCode, event); } } 

然后,你可以像这样开始你的ReactActivity

 Intent intent = new Intent(getApplicationContext(), MyReactActivity.class); startActivityForResult(intent, 123); 

得到像这样的结果:

 @Override protected void onActivityResult(int requestCode, int resultCode, Intent data) { if (requestCode == 123 && resultCode == Activity.RESULT_OK) { float result = data.getExtras().getFloat("result"); // Do whatever you want with "result" } } 

在React中使用它:

 import { NativeModules } from 'react-native'; // [...] // Call the function NativeModules.TestModule.closewithresult(654.532); 

也许我不明白你想要做什么..但不能只是build立一个本地模块,并让您的React本机应用程序调用该函数完成将数据传递到您的本机代码?

假设你的应用程序有一个React Native部分,它将用户的名字和姓氏作为input,并且他们碰到提交。

您可以像正常一样编写您的RN JavaScript:将2个TextInput字段的值映射到您的状态,以及一个带有onPress处理程序的Button。 在onPress处理程序中,您将调用您的本机模块并传递参数

 import { NativeModules } from 'react-native'; const NativeNameSubmission = NativeModules.NameSubmission; ... <Button onPress={() => NativeNameSubmission.submitName(this.state.firstName, this.state.lastName)} title="Submit"/> 

你的Native模块看起来像这样:

 public class RCTNameSubmission extends ReactContextBaseJavaModule { public RCTNameSubmission(ReactApplicationContext reactContext) { super(reactContext); } @Override public String getName() { return "NameSubmission"; } @ReactMethod public void submitName(String firstName, String lastName) { // save the name data for later use ... // Exit React App getCurrentActivity().finish(); } }