WebView学习指南1

本讲内容：WebView的使用方法

今天我们来学习一个可以显示网页的控件WebView。WebView的网页渲染引擎和Safari、Chrome一样都是Webkit。使用WebView进行互联网程序开发有以下优点： 
1、可以打开远程网址、也可以加载本地Html数据 
2、可以搭建Java和Javascript交互桥梁 
3、WebView控件可以高度定制。

下面我们通过几个例子来共同学习WebView的使用方法。

一、先做一个例子热热身看看效果，例子：通过WebView访问本博客 http://android.yaohuiji.com

1、先来一个简单的例子，新建一个项目Lesson29_WebView

2、因为要访问互联网所以先在AndroidManifest.xml中设定权限：

01	<?xml version="1.0" encoding="utf-8"?>

02	<manifest xmlns:android="http://schemas.android.com/apk/res/android"package="android.basic.lesson29" android:versioncode="1" android:versionname="1.0">

03	<application android:icon="@drawable/icon" android:label="@string/app_name">

04	<activity android:label="@string/app_name" android:name=".MainWebView">

05	<intent -filter="">

06	<action android:name="android.intent.action.MAIN">

07	<category android:name="android.intent.category.LAUNCHER">

08	</category></action></intent>

09	</activity>

10

11	</application>

12	<uses -sdk="" android:minsdkversion="8">

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

14	</uses></uses></manifest>

3、在res/layout/main.xml中放置一个输入框，一个按钮和一个WebView：

<?xml version="1.0" encoding="utf-8"?>    4、在Activity文件的OnCreate方法中默认载入一个百度页面，点击按钮时载入预设的网址 http://android.yaohuiji.com ：

01	package android.basic.lesson29;

02

03	import android.app.Activity;

04	import android.os.Bundle;

05	import android.view.View;

06	import android.webkit.WebView;

07	import android.widget.Button;

08	import android.widget.EditText;

09

10	public class MainWebView extends Activity {

11

12	WebView mWebView;

13

14	/** Called when the activity is first created. */

15

@Override

16	public void onCreate(Bundle savedInstanceState) {

17	super.onCreate(savedInstanceState);

18	setContentView(R.layout.main);

19

20

//定义UI组件

21	mWebView = (WebView) findViewById(R.id.WebView01);

22	Button b1 = (Button) findViewById(R.id.Button01);

23	final EditText et = (EditText) findViewById(R.id.EditText01);

24

25	//得到WebSetting对象，设置支持Javascript的参数

26	mWebView.getSettings().setJavaScriptEnabled(true);

27

//载入URL

28	mWebView.loadUrl("http://www.baidu.com");

29

//使页面获得焦点

30	mWebView.requestFocus();

31

32	//给按钮绑定单击监听器

33	b1.setOnClickListener(new View.OnClickListener() {

34

35

@Override

36	public void onClick(View v) {

37	//访问编辑框中的网址

38	mWebView.loadUrl(et.getText().toString());

39

}

40

});

41

42

}

43

}

5、运行程序，查看效果：

点击Go按钮，可以看到本博客出现，不过没有经过任何缩放处理，在接下里的例子我们继续研究，如何做更多的控制。

二、补充一点基础知识：关于WebSettings

1、先看一下WebView的继承关系，可以看到它不是在 android.widget包中，而是在android.webkit包中。

2、WebSettings ： WebView组件有一个辅助类叫WebSettings，它管理WebView的设置状态。该对象可以通过WebView.getSettings()方法获得。下面举几个例子来说明WebSettings的用法：

//得到WebSettings对象，设置支持Javascript的参数

mWebView.getSettings().setJavaScriptEnabled(true);

//设置可以支持缩放

mWebView.getSettings().setSupportZoom(true);

//设置默认缩放方式尺寸是far

mWebView.getSettings().setDefaultZoom(WebSettings.ZoomDensity.FAR);

//设置出现缩放工具

mWebView.getSettings().setBuiltInZoomControls(true);

三、加载assets目录下的本地网页

WebView调用assets目录下的本地网页和图片等资源非常方便，使用形如

wv.loadUrl("file:///android_asset/html/test1.html");

的调用方法即可，代码在第四段落里。

在test1中点击链接也可以跳转到test2

四、使用 LoadData 方法加载内容

可以在Java文件中或者XML文件中定义HTML的片段，也可以在assets目录中存放HTML文件，然后使用LoadData加载其中的内容，展示出来。下面我们使用第三部分的网页来演示一下如何使用LoadData方法，并且看看他们之间的区别。

1、新建项目Lesson29_WebView2

2、新建2个Html文件在assets/html下，内容略去，res/layout/main.xml的内容也略去了，相信对你来说已经不成问题。

3、MainWebView2.java 的内容如下：

01	package android.basic.lesson29;

02

03	import java.io.IOException;

04	import java.io.InputStream;

05

06	import org.apache.http.util.ByteArrayBuffer;

07	import org.apache.http.util.EncodingUtils;

08

09	import android.app.Activity;

10	import android.os.Bundle;

11	import android.view.View;

12	import android.webkit.WebView;

13	import android.widget.Button;

14

15	public class MainWebView2 extends Activity {

16	/** Called when the activity is first created. */

17

@Override

18	public void onCreate(Bundle savedInstanceState) {

19	super.onCreate(savedInstanceState);

20	setContentView(R.layout.main);

21

22

//定义UI组件

23	Button b1 = (Button) findViewById(R.id.Button01);

24	Button b2 = (Button) findViewById(R.id.Button02);

25

26	final WebView wv = (WebView) findViewById(R.id.WebView01);

27

28	//定义并绑定按钮单击监听器

29	b1.setOnClickListener(new View.OnClickListener() {

30

@Override

31	public void onClick(View v) {

32	//加载URL assets目录下的内容可以用 "file:///android_asset" 前缀

33	wv.loadUrl("file:///android_asset/html/test1.html");

34

}

35

});

36

37	//定义并绑定按钮单击监听器

38	b2.setOnClickListener(new View.OnClickListener() {

39

@Override

40	public void onClick(View v) {

41	String data = "";

42

try {

43	// 读取assets目录下的文件需要用到AssetManager对象的Open方法打开文件

44	InputStream is = getAssets().open("html/test2.html");

45	// loadData()方法需要的是一个字符串数据所以我们需要把文件转成字符串

46	ByteArrayBuffer baf = new ByteArrayBuffer(500);

47	int count = 0;

48	while ((count = is.read()) != -1) {

49	baf.append(count);

50

}

51	data = EncodingUtils.getString(baf.toByteArray(), "utf-8");

52	} catch (IOException e) {

53	e.printStackTrace();

54

}

55	// 下面两种方法都可以加载成功

56	wv.loadData(data, "text/html", "utf-8");

57	// wv.loadDataWithBaseURL("", data, "text/html", "utf-8", "");

58

}

59

});

60

61

}

62

}

4、运行程序单击第二个按钮，效果如下：

对比上面的例子，我们可以看到两个明显的区别，其一，图片没加载出来，其二链接失效，点击后无法加载test1.html 。

五、两个和WebView相关的重要对象：WebChromeClient  和 WebViewClient

和WebView相关的辅助对象，除了WebSettings以外还有WebChromeClient和WebViewClient。

接下来的这个例子内容比较丰富，虽然注释比较清晰，但是您一次消化起来还是比较困难的，因此您需要的是一点点耐心，多看几遍，最重要的是自己至少敲代码敲一遍。

1、在上面的例子中继续增加内容，增加 test3.html 的内容：

01

02

03	<script type="text/JavaScript">

04	function alertFuction(){

05

var a=1;

06

var b=2

07	alert(a+b);

08

}

09	function confirmFuction(){

10	confirm("你确定要删除吗?")

11

}

12

13

</script>

14

15

对话框测试

16	<input onclick="alertFuction()" value="提醒对话框" type="button">

17	<input onclick="confirmFuction()" value="选择对话框" type="button">

18

19	<a href="test1.html">上一页</a>