Android—WebView简单使用

来源：互联网发布：首份网络主播黑名单编辑：程序博客网时间：2024/04/30 14:16

华清创客学院 2016-12-12 08:49

有时候我们可能会碰到一些比较特殊的需求，比如说要求在应用程序里展示一些网页。相信每个人都知道，加载和显示网页通常都是浏览器的任务，但是需求里又明确指出，不允许打开系统浏览器，而我们当然也不可能自己去编写一个浏览器出来，这时应该怎么办呢？

不用担心，Android 早就已经考虑到了这种需求，并提供了一个 WebView控件，借助它我们就可以在自己的应用程序里嵌入一个浏览器，从而非常轻松地展示各种各样的网页。

一、WebView通过Url加载网页

WebView是View的子类，能够让一个网页内容看起来像是你应用程序的一部分一样。它只提供页面显示的功能，默认情况下不提供浏览器应具备的导航等功能。

首先我们来看一下WebView的简单使用：

1、获得WebView的实例；

2、调用WebView类中的loadUrl(String url)方法，加载指定的网址；

3、在工程的清单文件中添加上网权限

清单文件中的上网权限：

<uses-permission android:name="android.permission.INTERNET"/>

复制代码

Java代码：

public class MainActivity extends Activity {
WebView vb;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
vb = (WebView) findViewById(R.id.webView1);
vb.loadUrl("http://www.baidu.com");
}
}

当运行上面的代码后你会发现，程序会启动默认的浏览器来打开我们指定的网址，但是我们所希望的是在当前的应用中显示网页，那下面给大家介绍WebViewClient这个类以及其中的一些常用方法。WebViewClient类主要是用来帮助WebView处理各种通知、请求事件的，这其中有一些常用方法：

(1) shouldOverrideUrlLoading(WebView view, String url)，当加载的网页需要重定向的时候就会回调这个函数。

参数1：WebView对象

参数2：需要加载的url地址

返回值：return true意味着主程序接管网页加载，让我们自己操作，如果返回false让webview自己处理。

(2) onPageStarted(WebView view, String url, Bitmap favicon), 开始加载页面的回调;

(3) onPageFinished(WebView view, String url), 加载完成的回调。

当我们需要重写上述方法时需要调用WebView中setWebViewClient (WebViewClient client)方法，下面在原来代码更改为用Webview控件显示网页，代码如下：

public class MainActivity extends Activity {
WebView vb;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
vb = (WebView) findViewById(R.id.webView1);
//设置Webview
vb.setWebViewClient(new WebViewClient(){
@Override
//重写shouldOverrideUrlLoading方法
public boolean shouldOverrideUrlLoading(WebView view, String url) {
return false;
}
});
vb.loadUrl("http://www.baidu.com");
}
}

运行效果如下：

Android—WebView简单使用

二、WebView加载HTML字符串

有时候我们的webview可能只是html片段，而不是一个完整的网页，事实上绝大多数时候都是如此，完整的网页无需做成应用，而直接在浏览器访问。

这种情况我们使用 LoadData 或者 loadDataWithBaseURL方法，后者用的最多，这里需要调用WebView中的loadDataWithBaseURL(String baseUrl,String data, String mimeType, String encoding, String historyUrl)方法：

参数1：作为该网页的base page。可设置为null。

参数2：html字符串

参数3：类型，html数据需要设置为“text/html”

参数4：字符集，如果有中文需要设置为“utf-8”

参数5：历史网页的url，可设置为null。

下面是一个简单的实例，代码如下：

public class MainActivity extends ActionBarActivity {
WebView wb;
String data = "<html>" +
"<head><title>我的世界</title><head>" +
"<body>敢问路在何方，路就在脚下</body>" +
"</html>";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
wb = (WebView) findViewById(R.id.webView1);
wb.loadDataWithBaseURL(null, data, "text/html", "utf-8", null);
}
}

运行结果如下：

Android—WebView简单使用

三、WebView中JavaScript与Andorid中java方法互调

随着h5在移动端的普及，移动端对webview的使用越来越平凡，有的界面也不仅仅局限于网页的显示，很多时候就要涉及到webview与javascript代码之间的交互，这对于移动端工程师和web端工程师都是一个挑战，下面来总结下它们之间的交互和注意事项。

先说JavaScript中调用android代码，默认情况下，从WebView的界面中无法触发html中的JavaScript脚本，我们需要使能JavaScript功能，这样WebView才有能力处理html中的JavaScript脚本。使能JavaScript对应的方法为setJavaScriptEnabled(booleanflag)，该方法并不是WebView类中方法，它的使用过程如下：

（1）调用WebView中getSettings()方法获取WebSettings对象；

（2）调用WebSettings对象的实例方法setJavaScriptEnabled。

当参数设置为true时，表示使能JavaScript。

要想完成JavaScript调用android代码，还需介绍一个方法，WebView类中的addJavascriptInterface(Objectobject, String name)，

参数1：供JavaScript调用的对象

参数2：在JavaScript中使用的名字

该方法是这里的重点，将一个java对象绑定到一个javascript对象中，javascript对象名就是interfaceName，作用域是Global。

我们可以在JavaScript中调用Java中的函数的步骤如下：

（1）创建WebView对象

（2）使能WebView对象的JavaScript功能

（3）创建类，该类作为JavaScript调用Java代码的接口

（4）在该类中暴露方法，供JavaScript调用，注意：API 17之后的版本需要添加注解@JavascriptInterface。

（5）将接口类对象添加给WebView

addJavascriptInterface(Object,String)

（6）在html中添加JavaScript代码，调用Java对象中暴露的方法。

具体代码如下：

MainActivity：
public class MainActivity extends ActionBarActivity {
WebView wb;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
wb = (WebView) findViewById(R.id.webView1);
//使能JavaScript
wb.getSettings().setJavaScriptEnabled(true);
//绑定对应java对象到JavaScript
wb.addJavascriptInterface(new MyJavaScript(this), "MyJavaScript");
//加载本地文件
wb.loadUrl("file:///android_asset/my.html");
}
}

本地文件放在asset目录下，调用时路径格式为file:///android_asset/xx。

自定义JavaScript调用java的类：

public class MyJavaScript {
Context context;
public MyJavaScript(Context context) {
super();
this.context = context;
}
//供JavaScript调用的java方法，此处须与JavaScript中script标签中调用的方法名一致
public void ShowToast(String str){
Toast.makeText(context, str, Toast.LENGTH_SHORT).show();
}
}

本地HTML文件：

<html>
<meta charset="gb2312">//输出内容有中文时加上
<head>
<script >
function callAndroid(){
/*
*"MyJavaScript"要与addJavascriptInterface方法中的第二个参数一致
*"ShowToast"要与自定义类中北调用的方法一致
*/
MyJavaScript.ShowToast("JavaScript调用java");
}
</script>
</head>
<body>
<button
type="button" id="button1" onclick="callAndroid();" >
点击js调用java代码
</button>
</body>
</html>

复制代码

该HTML文件显示的页面只有一个“点击js调用java代码”的按钮，点击该按钮后会触发script中定义的点击事件方法callAndroid()，该方法会调用java代码中相对应的方法，从而实现JavaScript中调用android代码。运行效果如下，点击按钮后会弹出一个Toast：

Android—WebView简单使用

-------------------------------------------------------------

关注微信华清创客在线，与10万个程序员做朋友。

每天下午17：30干货分享，我们不见不散~

0 0