title: Android与WebView（网页）的使用以及交互
首先，Android上的WebView控件可以实现显示两种类型的网页，第一种是网络网页（比如百度、各大网站等…），第二种是链接本地的网页（HTML文件）。本篇文章主要讲Android的WebView控件怎么链接上这两种网页，以及Android与本地网页的交互！
效果图先行，这里演示了本地HTML 和 网络网页的一些交互
首先，让网页或者HTML文件显示在你的APP上
在你的XML布局页面添加一个WebView，如下：
1
2
3
4
5
6
7
8
9
10
11
12<?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">
<WebView
android:id="@+id/wb"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>在你的JAVA后台声明控件，然后调用WebView的
**.loadUrl();**方法设置URL如果调用的是本地的HTML文件，则需要先在项目中生成assets目录用于存放HTML文件，具体操作如下：
assets目录创建好了以后，将你的本地HTML文件复制进去就行了！
如果调用的是网络网址，只需要将网址整个复制下来即可！（我这里是CSDN的主页）
代码如下：
这里需要注意的是本地HTML的地址
file:///android_asset/xxx.html
1
2
3
4
5
6
7//本地HTML文件
String urlhtml = "file:///android_asset/myhtml.html";
//网站URL地址
String url="https://so.csdn.net/so/";
mWb.loadUrl(url);当然，仅此两行代码是没法达到效果图那样的效果的！
下面献上更多相关代码：这里需要注意的是
file:///android_asset/id这里的 id 和你在HTML中超链接的id一致1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24//适配屏幕
mWb.getSettings().setUseWideViewPort(true);
//添加JS支持
mWb.getSettings().setJavaScriptEnabled(true);
//网页加载进度监听
mWb.setWebChromeClient(new WebChromeClient() {
public void onProgressChanged(WebView view, int newProgress) {
super.onProgressChanged(view, newProgress);
//这里你可以选择在布局文件webview的上面加一个ProgressBar
//然后调用setProgress();方法传入 newProgress
}
});
//重写shouldOverrideUrlLoading方法 以实现和按钮的交互
mWb.setWebViewClient(new WebViewClient() {
public boolean shouldOverrideUrlLoading(WebView view, String url) {
//这里的 button 就是HTML中的 <a href="button">
if (url.equals("file:///android_asset/button")) {
showToast("点击了一下Android");
}
return true;
}
});当然这里把我的HTML代码也献上，防止有些不懂HTML编写的朋友犯难！（我自己也不太熟练HTML编写）
1
2
3
4
5
6
7
8
9
10
11
12<html>
<head>
<meta charset="UTF-8">
</head>
<body>
这里是本地HTML网页<br>
开启学习HTML之旅
</body>
<a href="button">
<input value="确定" type="button">
</a>
</html>最后如果有朋友有疑问的，可以评论区留言！我会第一时间尽我所能答复！
- 本文作者： Android YU
- 本文链接： http://yoursite.com/2020/03/20/Android中WebView的使用以及交互/
- 版权声明： 本博客所有文章除特别声明外，均采用 MIT 许可协议。转载请注明出处！