从React-Native代码调用Android活动

Question

我正在使用REACT-NATIVE来构建Android应用程序.我想从React-Native代码调用android活动.(当我点击我的反应本机代码中的按钮时,它应该调用android活动)

我有4个类文件

• MainActivity.java(在android studio中打开时由react-native创建)
• MainApplication.java(由react-native创建)
• Login.java(android活动文件)
• Example.java(android活动文件)

想要实现以下流程:

Login.java - > React-Native js - > Example.java

我已经通过以下链接,但无法理解

/sf/answers/2297770331/

类似的问题在这里问

React Native Android:显示来自Java的活动

Answer 1

要启动Android活动,您需要创建自定义本机模块.假设一个叫ActivityStarter; 它可以从JavaScript中使用如下:

import { ..., NativeModules, ... } from 'react-native';

export default class DemoComponent extends Component {
    render() {
        return (
        <View>
            <Button
                onPress={() => NativeModules.ActivityStarter.navigateToExample()}
                title='Start example activity'
            />
        </View>
        );
    }
}

ActivityStarter它只是一个实现React Native Java接口的Java类NativeModule.这个接口的繁重工作已经完成了BaseJavaModule,所以通常可以扩展一个或者ReactContextBaseJavaModule:

class ActivityStarterModule extends ReactContextBaseJavaModule {

    ActivityStarterModule(ReactApplicationContext reactContext) {
        super(reactContext);
    }

    @Override
    public String getName() {
        return "ActivityStarter";
    }

    @ReactMethod
    void navigateToExample() {
        ReactApplicationContext context = getReactApplicationContext();
        Intent intent = new Intent(context, ExampleActivity.class);
        context.startActivity(intent);
    }
}

这个班的名字并不重要; ActivityStarter暴露给JavaScript 的模块名称来自该getName()方法.

生成的默认应用程序react-native init包含一个MainApplication初始化React Native 的类.除此之外,它还扩展ReactNativeHost为覆盖其getPackages方法:

@Override
protected List<ReactPackage> getPackages() {
    return Arrays.<ReactPackage>asList(
            new MainReactPackage()
    );
}

如果您要将React Native添加到现有应用程序,则此页面会覆盖您Activity的内容onCreate,如下所示:

@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, "HelloWorld", null);

    setContentView(mReactRootView);
}

注意addPackage(new MainReactPackage()).无论您使用哪种方法,都需要添加一个公开我们的自定义模块的自定义包.它可能看起来像这样:

class ActivityStarterReactPackage implements ReactPackage {
    @Override
    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
        List<NativeModule> modules = new ArrayList<>();
        modules.add(new ActivityStarterModule(reactContext));
        return modules;
    }

    // UPDATE: This method was deprecated in 0.47
    // @Override
    // public List<Class<? extends JavaScriptModule>> createJSModules() {
    //     return Collections.emptyList();
    // }

    @Override
    public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
        return Collections.emptyList();
    }
}

最后,更新MainApplication以包含我们的新包:

@Override
protected List<ReactPackage> getPackages() {
    return Arrays.<ReactPackage>asList(
            new ActivityStarterReactPackage(), // This is it!
            new MainReactPackage()
    );
}

或者你可以做的addPackage(new ActivityStartecReactPackage())到ReactInstanceManager.builder().

您可以在此处找到完整,独立的示例.

UPDATE

createJSModules已从ReactPackage版本0.47中的界面中删除,并已从样本中注释掉.如果由于某种原因你坚持使用较旧版本的RN,你仍然需要它.