Tagging Screens Inside Webviews

Step 1: Create a Native JavaScript Interface

First, create a class in your native Android code that will act as a bridge to your WebView. This interface will contain the methods you want to expose to JavaScript.

public class WebAppInterface {
    @JavascriptInterface
    public void tagScreenName(String screenName) {
        UXCam.tagScreenName(screenName);
    }
}

Step 2: Attach the Interface to the WebView

Next, attach an instance of your interface class to the WebView, giving it a name (e.g., "UXCamBridge") that your JavaScript code will use to call it.

WebView webView = (WebView) findViewById(R.id.webview);
webView.addJavascriptInterface(new WebAppInterface(), "UXCamBridge");

Step 3: Call the Native Method from JavaScript

Finally, within your web content's JavaScript, you can now call the native method using the bridge name you defined in the previous step.

<input type="button" value="Tag Screen" onClick="tagScreenName('screenName')" />

<script type="text/javascript">
    function tagScreenName(screenName) {
        UXCamBridge.tagScreenName(screenName);
    }
</script>