Xamarin - Call Android function with JavaScript

Question

I've been trying to access a function in Android from my JavaScript. It works perfectly in Java, but somehow it won't work in C#.

EDIT: The index.html does open correctly in C#, but the console logs "[chromium] [INFO:CONSOLE(18)] "Uncaught TypeError: Object [object Object] has no method 'makeToast'", source: file:///android_asset/www/index.html?message= (18) [WebViewCallback] No application can handle file:///android_asset/www/index.html?message=fgg&length=on"

This is my activity:

namespace WebappTest
{
[Activity (Label = "WebappTest", MainLauncher = true, Icon = "@drawable/icon")]
public class MainActivity : Activity
{

    protected override void OnCreate (Bundle bundle)
    {
        base.OnCreate (bundle);

        // Set our view from the "main" layout resource
        SetContentView (Resource.Layout.Main);

        WebView webView = FindViewById<WebView> (Resource.Id.webView1);
        webView.LoadUrl("file:///android_asset/www/index.html");

        webView.Settings.JavaScriptEnabled = true;
        webView.AddJavascriptInterface(new WebViewJavaScriptInterface(this), "app");
    }
}


/*
 * JavaScript Interface. Web code can access methods in here 
 * (as long as they have the @JavascriptInterface annotation)
 */
public class WebViewJavaScriptInterface : Java.Lang.Object{

    private Context context;

    /*
     * Need a reference to the context in order to sent a post message
     */
    public WebViewJavaScriptInterface(Context context){
        this.context = context;
    }

    /* 
     * This method can be called from Android. @JavascriptInterface 
     * required after SDK version 17. 
     */
    [JavascriptInterface]
    public void makeToast(String message, bool lengthLong){
        Toast.MakeText (context, message, (lengthLong ? ToastLength.Long : ToastLength.Short)).Show ();
    }
}

}

and this is my index.html

<!DOCTYPE html>
<html>
<head>
<title>JavaScript View</title>

<script type="text/javascript">

    function showToast(){
        var message = document.getElementById("message").value;
        var long = document.getElementById("length").checked;

        /* 
            Call the 'makeToast' method in the Java code. 
            'app' is specified in MainActivity.java when 
            adding the JavaScript interface. 
         */
        app.makeToast(message, long);
        return false;
    }

    /* 
        Call the 'showToast' method when the form gets 
        submitted (by pressing button or return key on keyboard). 
     */
    window.onload = function(){
        var form = document.getElementById("form");
        form.onsubmit = showToast;
    }
</script>
</head>

<body>

<form id="form">
Message: <input id="message" name="message" type="text"/><br />
Long: <input id="length" name="length" type="checkbox" /><br />

<input type="submit" value="Make Toast" />
</form>

</body>
</html>

I really can't seem to understand why the same does work in Java (Eclipse) but not in C# (Xamarin). The only think that is really different is this:

C#:

public class WebViewJavaScriptInterface : Java.Lang.Object

Java:

public class WebViewJavaScriptInterface

But I doubt that that has anything to do with it.

I'd like to know how to solve this so that it does work in C#

I'm experiencing the same thing. If you look at this example you'll see that we have to implement the IRunnable interface on the JavaScriptInterface class, but it doesn't work for me. — Jannie Theunissen
– Jannie Theunissen, Commented Apr 27, 2015 at 6:40

Jannie Theunissen · Accepted Answer · 2015-04-27 07:10:38Z

2

I got it working by exporting the method myself:

using Java.Interop;

....

[JavascriptInterface, Export ("run")]
public void Run ()
{
   Toast.MakeText (context, "Hello from C#", ToastLength.Short).Show ();
}

Give it a shot. For targeting API's lower than 17, I would rather use the Java.Lang.IRunnable interface as documented.

answered Apr 27, 2015 at 7:10

Jannie Theunissen

30.3k21 gold badges110 silver badges136 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Xamarin - Call Android function with JavaScript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related