Implementation of WebView and Js Interaction in Android

2021-07-09 09:20:13
OfStack

Get an WebView object

Call the getSettings () method of the WebView object to get the WebSettings object

Call the setJavaScriptEnabled () method of the WebSettings object to set js available, parameter: Boolean

When judging whether js is supported, don't use alert (). It doesn't work by default. You can test it with document. write () first

Call the addJavascriptInterface (obj, interfaceName) method of the WebView object and add the js interface. Parameters: Object object, String interface name (the alias of this object in js)

Define 1 inner class MyJavascript

Define 1 method showToast () to display toast. api version greater than 17 needs to be annotated @ JavascriptInterface

java code:


package com.tsh.mywebview;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.app.ProgressDialog;
import android.graphics.Bitmap;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.Menu;
import android.view.MenuItem;
import android.view.Window;
import android.webkit.JavascriptInterface;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;
public class MainActivity extends Activity {
private WebView webview;
private ProgressDialog pd;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
pd=new ProgressDialog(this);
pd.setMessage(" Loading ...");
//webview Simple settings of 
webview=(WebView) findViewById(R.id.wv_internet);
//http://100.65.187.106/test.php
webview.loadUrl("http://100.65.187.106/test.php");
WebSettings websettings=webview.getSettings();
websettings.setSupportZoom(true);
websettings.setBuiltInZoomControls(true);
//js Interactive 
new MyJavascript().showToast("111");
websettings.setJavaScriptEnabled(true);
webview.addJavascriptInterface(new MyJavascript(), "Android");
webview.loadUrl("javascript:documentWrite(' Test ')");
webview.setWebViewClient(new WebViewClient(){
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
pd.show();
}
@Override
public void onPageFinished(WebView view, String url) {
pd.dismiss();
}
});
}
// Expose to js Functional interface of 
public class MyJavascript{
// Show toast 
//  If target  Greater than or equal to API 17 You need to add the following annotations 
@JavascriptInterface
public void showToast(String text) {
Toast.makeText(MainActivity.this, text, 1).show();
}
// Display loading
@JavascriptInterface
public void showProgressDialog(String text) {
pd.setMessage(text);
pd.show();
}
}
// Back key 
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if(keyCode==KeyEvent.KEYCODE_BACK&&webview.canGoBack()){
webview.goBack();
return true;
}
return super.onKeyDown(keyCode, event);
}
// Menu key 
@Override
public boolean onCreateOptionsMenu(Menu menu) {
menu.add(0, 0, 0, " Refresh ");
menu.add(0, 0, 1, " Backward ");
menu.add(0, 0, 2, " Advance ");
return super.onCreateOptionsMenu(menu);
}
// Menu click event 
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getOrder()) {
case 0:
webview.reload();
break;
case 1:
if(webview.canGoBack()){
webview.goBack();
}
break;
case 2:
if(webview.canGoForward()){
webview.goForward();
}
break;
}
return super.onOptionsItemSelected(item);
}
}

js code:


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title> Test android Program </title>
</head>
<body>
 Test android And js Interactive 
<br/>
<button onClick="showToast()"> Show toast </button>
<br/>
<button onClick="showProgressDialog()"> Display loading</button>
<script type="text/javascript">
function showToast(){
Android.showToast(" Show toast ");
}
function showProgressDialog(){
Android.showProgressDialog(" Show progress bar ");
}
</script>
</body>
</html>

The above content is this site to introduce Android WebView and Js interactive implementation method, hope to help you above!