上一篇文章我们聊到了webView的一些操作
接下来我们聊一个webView与js交互的话题,具体的实现步骤在这就不多说了,注释写的足够详细,相信小白都可以看的懂.
来 小二 上代码
首先我们一定要记得配置网络权限
<uses-permission android:name="android.permission.INTERNET"/>
MainActivity, 这里是webView与js的交互的一些逻辑逻辑
package com.webviewjs;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Intent;
import android.graphics.Bitmap;
import android.net.Uri;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.KeyEvent;
import android.view.View;
import android.webkit.JavascriptInterface;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
//这是本地的写法
// private static final String HTML_URL = "file:///android_asset/test.html";
private static final String HTML_URL = "http://172.17.8.100/images/small/default/test.html";
private WebSettings webViewSettings;
private WebView webView;
@SuppressLint("JavascriptInterface")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webView = (WebView) findViewById(R.id.show_wb);
webViewSettings = webView.getSettings();
webViewSettings.setJavaScriptEnabled(true);
webViewSettings.setSupportZoom(true);
webView.setWebViewClient(new WebViewClient() {
/**
* 给WebView加一个事件监听对象(WebViewClient)并重写shouldOverrideUrlLoading,
* 可以对网页中超链接按钮的响应
* 当按下某个连接时WebViewClient会调用这个方法,并传递参数:当前响应的的url地址
*/
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
// 此处可添加一些逻辑:是否拦截此url,自行处理
// 下方2行代码是指在当前的webview中跳转到新的url
view.loadUrl(url);
return true;
}
});
// Android端定义一个方法,给js调用,
// 使用webView对象,调用addJavascriptInterface方法(),
// 第一个参数是写一个类,在这里面提供要暴露的方法,方法前最好加一个注解:@JavascriptInterface,
// 第二个参数是标识字符串,js通过这个标识,调用我们的方法. 在js里面是这样使用的:Android.showToast(content);
webView.addJavascriptInterface(new Object() {
@JavascriptInterface
public void showToast(String content) {
Toast.makeText(getApplicationContext(), content, Toast.LENGTH_LONG).show();
}
}, "Android");
}
//调用js暴露的方法.格式固定:webView对象.loadUrl("javascript:js方法名(参数)");
public void call(View v) {
webView.loadUrl("javascript:changeInputValue('哈哈!很高兴认识你,我叫小白')");
}
//加载本地的文件.
public void load(View v) {
//webView.loadUrl("http://www.qq.com");
webView.loadUrl(HTML_URL);
}
}
基本操作就如上,最后看一下布局文件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:id="@+id/path_et"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:hint="输入访问网址,直接从www开始即可"/>
<Button
android:onClick="load"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="加载"/>
</LinearLayout>
<WebView
android:id="@+id/show_wb"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="match_parent">
</WebView>
<Button
android:onClick="call"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="调用js的方法"/>
</LinearLayout>
这里我没有对输入框和按钮做自定义样式操作,如果大家喜欢的可以自己定义一下,在我的上一篇文章里关于WebView的操作我用到了自定义shape样式,大家想了解的可以看一下,下面地址附上:
https://blog.csdn.net/LZ0419/article/details/84190270
如果大家有什么好的建议可以在下方评论,大家一起讨论学习哦.