Making Android interacting with Web App

Android App and Web App are like two different worlds, but at times we still have to make them work together. It’s not an ideal world, but what has to be done, has to be done.

Sample App (with Code)

For the purpose of this tutorial, I provide an App with a WebView on the top part and a native Android View at the bottom part. Both have a similar view widget, and I pass input text across both of them, as shown in the GIF below.

The code could be accessed from https://github.com/elye/demo_web_native_app_interaction. The web app is basically a JavaScript-run HTML page stored in the asset folder (you could get it to work with an internet-loaded webpage as well).

This shows they could communicate with each other. To know how this is done, read on.

Native App to Web App

For communicate from a Native App to Web App, it is relatively simple. You just need to either load the JavaScript using loadUrl from the webView or use the evaluateJavascript function as below.

my_web_view.evaluateJavascript("javascript: " +…