Pass activity variable to javascript function in webview Android

Question

Pass activity variable to javascript function in webview Android

Navigation

#1 by (0 votes)

0

I'm trying to pass a variable that is in SearchView in the toolbar of an activity to a javascript function of an html page loaded in webview, but I'm not getting it.

I've been researching for two days and all the examples I found did not work. I am using sdkversion 16 in my test project and the devices on which the app will be directed are version 16 and above.

Code from my webview:

    webView.setWebViewClient(new myWebClient());
    webView.getSettings().setJavaScriptEnabled(true);
    webView.getSettings().setBuiltInZoomControls(true);
    webView.getSettings().setDisplayZoomControls(false);
    webView.getSettings().setSupportZoom(true);
    webView.loadUrl("file:///android_asset/html/index.html");

WebClient:

public class myWebClient extends WebViewClient
{
    @Override
    public void onPageStarted(WebView view, String url, Bitmap favicon) {
        // TODO Auto-generated method stub
        super.onPageStarted(view, url, favicon);
        progressBar.setVisibility(View.VISIBLE);
    }

    @Override
    public boolean  shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
        super.shouldOverrideUrlLoading(view, request);
        progressBar.setVisibility(View.VISIBLE);
        return true;
    }

    @Override
    public void onPageFinished(WebView view, String url) {
        // TODO Auto-generated method stub
        super.onPageFinished(view, url);
        progressBar.setVisibility(View.INVISIBLE);
    }

    @Override
    public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {
        super.onReceivedError(view, request, error);
        webView.loadUrl("file:///android_asset/html/error.html");
    }
}

SearchView:

@Override
public boolean onCreateOptionsMenu(Menu menu) {

    getMenuInflater().inflate(R.menu.search, menu);

    MenuItem searchItem = menu.findItem(R.id.action_search);
    SearchView searchView = (SearchView)searchItem.getActionView();
    searchView.setOnQueryTextListener(this);
    searchView.setQueryHint(getString(R.string.search_hint));
    searchItem.setOnActionExpandListener(this);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {

    return super.onOptionsItemSelected(item);
}

@Override
public boolean onMenuItemActionExpand(MenuItem item) {
    return true;
}

@Override
public boolean onMenuItemActionCollapse(MenuItem item) {
    return true;
}

@Override
public boolean onQueryTextSubmit(String query) {
    buscaString(query);
    return true;
}

@Override
public boolean onQueryTextChange(String newText) {
    return true;
}

public void buscaString(String s){
    //Solução utilizada
    webView.loadUrl("javascript:texto('"+s+"')");

}

javascript function:

<head>
<script>
  function texto(val){
    var $context = $(".container");

    $context.removeHighlight();
    $context.highlight(val);    
}
</script>
</head>

javascript android android-webview

asked by anonymous 25.02.2018 / 02:50

1 answer

Personnel Mapping x Document OneToOne, Cascade How to display image with Angular 2+

score 0 · Answer 1

First define a class with the @JavascriptInterface annotation in the methods.

public class JsHelper {
    private int attr1;
    private int attr2;

    @JavascriptInterface
    public int getAttr1() {
        return attr1;
    }

    @JavascriptInterface
    public void setAttr1(int attr1) {
        this.attr1 = attr1;
    }

    @JavascriptInterface
    public int getAttr2() {
        return attr2;
    }

    @JavascriptInterface
    public void setAttr2(int attr2) {
        this.attr2 = attr2;
    }
}

Create an instance of this class and switch to WebView:

JsHelper helper = new JsHelper();
helper.setAttr1(2);
helper.setAttr2(0);

webView.addJavascriptInterface(javascript, "Android");

Within the webView, you can access the attributes of this instance as follows:

console.log(Android.getAttr1());