Search code examples
androidcordovaphone-call

Best way to call activity Method with Phonegap 3.0 from js


I'm trying to make a phone call from my index.html in phonegap using a native method from MainActivity.

I'm using phonegap 3.0 and android 4.3 platform. I tried the second answer on this post but it is not working for this versions.

I would like to know what is the best approach to get through this?


Solution

  • You can create a custom plugin to call any method from the native side. Create a separate JavaScript file, say customplugin.js, and put this into it:

    var CustomPlugin = {};
    
    CustomPlugin.callNativeMethod = function() {
        cordova.exec(null, null, "CustomPlugin", "callNativeMethod", []);
    };
    

    Now on the native Java side, create a new class and name it CustomPlugin.java, then add this:

    package com.yourpackage;
    
    import org.apache.cordova.CordovaWebView;
    import org.apache.cordova.api.CallbackContext;
    import org.apache.cordova.api.CordovaInterface;
    import org.apache.cordova.api.CordovaPlugin;
    
    import com.yourpackage.MainActivity;
    
    public class CustomPlugin extends CordovaPlugin
    {
        private static final String TAG   = "CustomPlugin";
    
        private CallbackContext callbackContext = null;
        private MainActivity activity = null;
    
        /** 
         * Override the plugin initialise method and set the Activity as an 
         * instance variable.
         */
        @Override
        public void initialize(CordovaInterface cordova, CordovaWebView webView) 
        {
            super.initialize(cordova, webView);
    
            // Set the Activity.
            this.activity = (MainActivity) cordova.getActivity();
        }
    
        /**
         * Here you can delegate any JavaScript methods. The "action" argument will contain the
         * name of the delegated method and the "args" will contain any arguments passed from the
         * JavaScript method.
         */
        public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException 
        {
            this.callbackContext = callbackContext;
    
            Log.d(TAG, callbackContext.getCallbackId() + ": " + action);
    
            if (action.equals("callNativeMethod")) 
            {
                this.callNativeMethod();
            }
            else
            {
                return false;
            }
    
            return true;
        }
    
        private void callNativeMethod()
        {
            // Here we simply call the method from the Activity.
            this.activity.callActivityMethod();
        }
    }
    

    Make sure you map the plugins in the config.xml file by adding this line:

    ...
    <feature name="CustomPlugin">
        <param name="android-package" value="com.yourpackage.CustomPlugin" />
    </feature>
    ...
    

    Now to call the plugin from your index.html you can simply call your JavaScript method:

    CustomPlugin.callNativeMethod();
    

    Using this method will allow you to set up many custom methods conveniently. For more information check the PhoneGap plugin development guide here.