从反应本代码调用Android活动

我正在使用React-Native来构建Android应用。我想调用反应代码的Android活动。（例如，当我单击"本机代码"中的按钮时，它应该调用Android活动）

我有4个类文件

mainActivity.java（在Android Studio中打开时由反应创建）
mainapplication.java（由React-Native创建）
ligin.java（android活动文件）
示例java（android活动文件）

想要达到以下流程：

我已经经历了以下链接，但无法理解

https://stackoverflow.com/a/32825290/4849554

此处问的类似问题

反应天然Android：显示Java的活动

要启动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只是一个Java类，它实现了称为NativeModule的React本机Java接口。该界面的繁重举重已经由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从版本0.47的ReactPackage接口中删除，并已从示例中评论。如果由于某种原因与较旧版本的RN陷入困境，您仍然需要它。

更新2019年3月

样本项目现在支持iOS的类似功能。

相关内容

最新更新

热门标签：