android和h5的交互(一)

其实之前也没怎么接触这块,第一是自己开发的时间并不长,第二是公司开发的项目基本上都是原生的。快过年了,觉得有必要对今年的一些东西做一些总结,就以此作为一个开篇吧。

一、js方法中调用android的方法

首先,我们新建一个项目,然后在启动的activity里面(此处为MainActivity)就写一个按钮,


布局文件就一个button就不贴了,代码也很简单,就是让他跳转一个WebActiviy,如下图:

其中H5_DIR为我存放静态html的路径(WebActivity中会用到,其实可以不要写在Activity里面,当时随手写了,就不改了,请知悉),下图为文件的目录结构:


WebActivity的页面很简单,就是一个返回按钮,一个显示按钮,还有一个WebView用来加载上图所展示的first.html,如下图:


加载webview的代码如下图,


如上上图中展示的返回箭头是html中所在,这时如果想要点击此箭头返回上一个activity那就要js调用android的本地方法,

首先,我们通常会封装一个类,用来做交互,话不多说,直接贴代码,


接下来,WebActivity中直接调用,

webView.addJavascriptInterface(new JavaScriptInterface(this),"Android");

当然,你js中也要有相应的方法,


注意的是此处你的Android其实就是webView.addJavascriptInterface(new JavaScriptInterface(this),"Android")这个方法中最后定义的这个Android,两者保持一直即可,如此,便完成了js调用android本地方法

二、android方法中调用js的方法

我了解的主要分两种情况吧,一种是调用无返回参数的,比如我点击我WebActivity中的返回按钮可以调用js中的back()方法,而其实我现在back()方法其实调用了android本地的finish()方法,所以也可以完成页面的返回,调用方法如下:findViewById(R.id.btnBack).setOnClickListener(new View.OnClickListener() {

@Override

    public void onClick(View v) {

webView.loadUrl("javascript:back()");

}

});

还有一种是调用有返回参数的,首先在我的first.html中添加一个简单的方法,比如:function num(){

return 10;

}

然后我们在WebActivity中的调用如下:

findViewById(R.id.btnShow).setOnClickListener(new View.OnClickListener() {

@RequiresApi(api = Build.VERSION_CODES.KITKAT)

@Override

    public void onClick(View v) {

webView.evaluateJavascript("num()",new ValueCallback() {

@Override

            public void onReceiveValue(String value) {

Toast.makeText(WebActivity.this, value, Toast.LENGTH_SHORT).show();

}

});

}

});

直接可以用土司弹出10,如此便完成了android对js方法的调用。

第一次写,写的有点乱,多多见谅!需要源码或者有什么问题的可以在下面留言,大家互相交流,我的开发时间也很短,希望大家可以共同进步!

你可能感兴趣的:(android和h5的交互(一))