Mixing cordova and native activities in Android

Question

I want the majority of my app (list items, storage, sign in, about screens etc...) handled in cordova, because it is just painful to do that in the native workflow.

But I have a specific activity (that I already created) that cannot be done with cordova (at least not nicely and fast enough). How should I create this app?

• Am I supposed to create a cordova plugin that will load only these two activities?
• Should I generate a cordova app via the cli or should I embed cordova into one activity?

If there is more material on this I would love to hear about it.

Thanks in advance.

Answer 1

This depends on the activity you created.

If your main activity is the Cordova screen, and it's going to be full screen, and some action on the Cordova part will launch your native activity for a certain task, then you should use a plugin for that, that launches your activity using an intent and when you finish with it you close it and go back to the Cordova activity, returning a value or not.

If you want to mix the Cordova view with native view, where none of them is full screen, then you should go for embedding Cordova in a native project.

If your activity is going to be your main activity, then embedding Cordova is your only option.

As you asked for examples and you don't think real plugins aren't a good example, I'll simplify the plugin creation guide

A plugin needs a plugin.xml file that looks like this:

<?xml version="1.0" encoding="UTF-8"?>
<plugin xmlns="http://apache.org/cordova/ns/plugins/1.0"
        id="your-plugin-id" version="1.0.0">
    <name>pluginName</name>
    <description>description of the plugin</description>
    <license>License of the plugin</license>
    <js-module src="www/pluginName.js" name="pluginName">
        <clobbers target="pluginName" />
    </js-module>
    <platform name="android">
        <config-file target="res/xml/config.xml" parent="/*">
            <feature name="PluginName" >
                <param name="android-package" value="your.plugin.package.pluginName"/>
            </feature>
        </config-file>

        <source-file src="src/android/PluginName.java" target-dir="your/plugin/package/PluginName" />
    </platform>
</plugin>

By looking at it, you can see you also need a www folder with a pluginName.js file on it, and a src/android folder with a pluginName.java file on it.

The pluginName.js should be something like:

function showNativeView() {
    cordova.exec(successCallback, errorCallback, "PluginName", "showNativeView", [arguments]);
}

First param is the successCallback function to call when the plugin finish executing. Second param is the errorCallback function to call if the plugin had any problem Third param is the name of the java class that you will call, it has to match the one on the plugin.xml Fourth param is the action to call in the java class And fifth is an array or arguments if you want to send any. To execute it call showNativeView() from a button click or however you want. Reminder, this is overly simplified, the proper way of doing it should be creating a namespace for the plugin and adding the different functions to it, but I want to keep it simple.

Finally the PluginName.java should be something like this:

    @Override
    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {
        if ("showNativeView".equals(action)) {
            Intent yourIntent = new Intent(this.cordova.getActivity().getBaseContext(), YourActivityToLaunch.class);
cordova.getActivity().startActivity(yourIntent);
            callbackContext.success();
            return true;
        }
        return false;  // Returning false results in a "MethodNotFound" error.
    }

This launches a simple intent that doesn't return anything back, if your activity return something then you have to use

this.cordova.startActivityForResult(this, yourIntent, REQUEST_CODE);

And add the

@Override
public void onActivityResult(int requestCode, int resultCode, Intent intent) {
    String result = intent.getStringExtra("WHATEVER_THE_INTENT_RETURNS"),
    this.callbackContext.success(result);
}

You call the success here instead of doing it right after launching the intent, and return the value the activity returned. You should also check the REQUEST_CODE to match with the one you used to launch the intent, the result of the activity, etc.