原理其实很简单,借助webview加载本地html文本,加载完成之后调用js函数,最后通过设置的addJavascriptInterface设置的回调接口返回js函数内的计算结果,完成android代码的调用(具体实现如下)。
1、html文本准备:将html文本编辑好添加到android工程下assets文件夹内
html文本内容(android_js.html)
<html>
<script type="text/javascript">
function androidtojavascript(a,b) {
CallBackToAndroid.onResult("I am from javascript end:"+add(a,b));
}
function add(a,b){
return a+b;
}
</script>
</html>
<html>
<script type="text/javascript">
function androidtojavascript(a,b) {
CallBackToAndroid.onResult("I am from javascript end:"+add(a,b));
}
function add(a,b){
return a+b;
}
</script>
</html>
android代码访问路径:file:///android_asset/android_js.html
2、代码
package com.example.androidtojsandbackdemo;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.View.OnClickListener;
import android.webkit.JavascriptInterface;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.app.AlertDialog.Builder;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
((Button) findViewById(R.id.show))
.setOnClickListener(new OnClickListener() {
public void onClick(View v) {
if (v.getId() == R.id.show) {
testJS();
}
}
});
}
@SuppressLint({ "JavascriptInterface", "SetJavaScriptEnabled" })
private void testJS() {
WebView webView = new WebView(MainActivity.this);
// 设置WebView属性,能够执行Javascript脚本
webView.getSettings().setJavaScriptEnabled(true);
// 添加js回调接口
webView.addJavascriptInterface(new JsCallBack() {
//如果应用的android:targetSdkVersion数值为17+)JS只能访问带有 @JavascriptInterface注解的Java函数
public void onResult(String result) {
showNoteDialog(result);
}
}, "CallBackToAndroid");
// web加载进度监听
webView.setWebViewClient(new WebViewClient() {
public void onPageFinished(WebView view, String url) {
// 加载完毕之后调用js函数
Log.e("加载完成....", url);
view.loadUrl("javascript:androidtojavascript(5,6)");
};
});
// 加载本地html文本(里面包含js代码)
webView.loadUrl("file:///android_asset/android_js.html");
}
public interface JsCallBack {
//如果应用的android:targetSdkVersion数值为17+)JS只能访问带有 @JavascriptInterface注解的Java函数
@JavascriptInterface
public void onResult(String result);
}
private void showNoteDialog(String result) {
Builder builder = new Builder(MainActivity.this);
builder.setTitle("js代码返回信息").setMessage(result)
.setPositiveButton("知道了", null).show();
}
}
到此通过android代码和js代码互调就完成了。