WebView

WebView

一、、WebView：

（一）、介绍：

        Android提供了一个内置浏览器，该浏览器可以查看网站，查看邮件，播放视频。要使用该内置浏览器，要通过WebView组件实现。webView组件式专门用来浏览网页的。

类结构：

java.lang.Object    ↳ android.view.View      ↳ android.view.ViewGroup        ↳ android.widget.AbsoluteLayout          ↳ android.webkit.WebView

（二）、webview组件常用方法：【掌握】

1. loadUrl()
2. loadData()
3. loadDataWithBaseURL()
4. capturePicture()
5. goBack()
6. goForward()
7. stopLoading()
8. reload()

（三）、WebView组件显示url页面的内容：

1、基本代码：

webView_main = (WebView) findViewById(R.id.webView_main);
webView_main.loadUrl("http://www.qq.com");

（四）、WebView组件加载html代码：

1、基本代码：

webView_main = (WebView) findViewById(R.id.webView_main);
// webView_main.loadData(data, "text/html","utf-8");//这个方法中虽然设置了字符集，但是运行效果中发现依然中文会显示乱码。为了解决这个问题，建议使用loadDataWithBaseURL()方法。
webView_main.loadDataWithBaseURL(null, data, "text/html", "utf-8", null);

2、如果加载的html代码中包含javascript语言，会如何呢？

运行后发现，所有的javascript都不会执行。因为WebView 在默认情况下不支持javascript。如何让执行javascript呢？

让WebView支持javascript的两个步骤：

• 使用 WebView 组件的WebSettings对象的setJavaScriptEnabled()方法。这种做法是让 WebView 能支持绝大多数的javascript语言。但是依然不支持alert等警告对话框语句。
• 使用 WebView 组件的setWebChromeClient()方法。这种做法是让 WebView 也支持显示alert等警告对话框。

基本代码：

webView_main.getSettings().setJavaScriptEnabled(true);// 支持运行javascript

webView_main.setWebChromeClient(new WebChromeClient());// 支持运行特殊的javascript（例如：alert()）

webView_main.setWebViewClient(new WebViewClient());// 当点击超链地址后不会新打开浏览器来访问，而是始终在本app中浏览页面

3、如果html中包含有超级链接地址，WebView能顺利执行吗？

 经过运行后发现，WebView中的超链地址在点击后，会跳出该应用程序，而弹出新的浏览器去访问该网页。

如果解决呢？调用webview对象的setWebViewClient()方法即可解决。

webView_main.setWebViewClient(new WebViewClient());

【注意：】

WebView除了可以加载服务器端的网页，还可以加载本地资产目录中的网页文件。网页文件格式为："file:///android_asset/文件名称"。 

例如：

// 加载本地资产目录下的网页文件

webView_main.loadUrl("file:///android_asset/网页文件名称.html")。

二、WebKit

（一）、WebKit概述

        WebKit是一个开源的浏览器网页排版引擎。Android浏览器的内核就是WebKit引擎，而苹果浏览器Safari也采用WebKit引擎。与之相对应的引擎有Gecko（Mozila、Firefox使用），Trident（也称MSHTML，IE使用）。WebKit是一个非常强大的Web应用平台，而Google对WebKit进行了封装，为开发者提供了丰富的Java接口，其中最重要的便是android.webkit.WebView控件。

（二）、WebSettings常用方法

        通过以上代码，可以实现WebView加载网页内容，但是对于HTML文本的Javascript代码却无法加载运行。为了解决这个问题要借助WebSettings类。WebSettings类除了可以设置是否支持Javascript外，还具有set系列方法来设置WebView的属性和状态。WebSettings对象通过WebView对象的getSettings()方法来获取。

表2  WebSettings常用方法

方法	描述
setJavaScriptEnabled(boolean flag)	设置是否支持Javascript
setBlockNetworkImage(boolean flag)	设置是否阻止网络图片加载
setBuiltInZoomControls(boolean enabled)	将HTML文本内容加载到WebView中
setCacheMode(int mode)	设置缓存模式
setDefaultFontSize(int size)	设置默认字体大小
setFixedFontFamily(String font)	设置固定使用的字体
setDefaultTextEncodingName(String encoding)	设置解码时默认的字符集
setSupportZoom(boolean support)	设置是否支持变焦
setAllowFileAccess(boolean allow)	设置是否允许访问WebView中文件。就是file:///android_asset和file:///android_res路径下的资产和资源文件。默认允许访问。

（三）、WebChromeClient常用方法

        至此对于网页中一般的Javascript都可以被WebView加载执行了。但是某些特殊的Javascript语句依然无法执行。例如Javascript语句中的Alert、Confirm、Prompt等对话框。为了解决这个问题，要借助WebChromeClient类。WebChromeClient类专门用来辅助WebView处理Javascript的对话框、网站图标、网站Title、加载进度等。

表3  WebChromeClient常用方法

方法	描述
onJsAlert()	处理Javascript中Alert对话框
onJsConfirm()	处理Javascript中Confirm对话框
onJsPrompt()	处理Javascript中Prompt对话框
onProgressChanged()	加载进度条改变
onCloseWindow()	关闭WebView
onCreateWindow()	创建WebView
onReceivedIcon()	Icon图标改变
onReceivedTitle()	网页Title改变
onRequestFocus()	WebView显示焦点

（四）、WebViewClient常用方法

        WebView解决了支持Javascript的问题。但是新的问题又出来了。当点击WebView中的超链接后，原本希望目标网页在当前WebView中显示，但是却打开了系统浏览器来加载目标网页。为了解决这个问题，要借助WebViewClient类。WebViewClient类专门用来辅助WebView处理各种通知、请求等事件。通过WebView对象调用setWebViewClient()方法来指定一个WebViewClient对象，重写WebViewClient对象中的shouldOverrideUrlLoading()方法，使得当有新连接时，使用当前WebView来显示网页。WebViewClient除此之外，还有其他的方法。

表4  WebViewClient常用方法

方法	描述
shouldOverrideUrlLoading()	新的链接在当前WebView中打开
onPageStarted()	网页开始加载
onPageFinished()	网页加载完毕
doUpdateVisitedHistory()	更新访问历史记录的数据库
onLoadResource()	加载指定Url地址提供的资源
onFormResubmission()	应用程序重新请求网页数据
onScaleChanged()	WebView发生改变

（五）、WebView与JavaScript

        WebView不但可以运行HTML代码中Javascript语句，还可以同Javascript互相调用。学会本节内容，甚至可以用HTML和Javascript来编写Android应用。要实现WebView与Javascript互相调用，需要通过addJavascriptInterface()方法。

public void addJavascriptInterface(Object obj, String interfaceName)

        该方法将一个Java对象绑定到一个Javascript对象中，Javascript对象名就是参数interfaceName，作用域是Global，这样便扩展了Javascript的API，可以通过Javascript获取到Android中的数据。

assets/LoginInfo.html代码：

 

  

  

 

 

 

 

 

  

用户名：

密码：

  

 

MainActivity.java核心代码：

1.public class MainActivity extends Activity {

2. private WebView webView_main;

3. private WebSettings webSettings = null;

4. @Override

5. protected void onCreate(Bundle savedInstanceState) {

6. super.onCreate(savedInstanceState);

7. setContentView(R.layout.activity_main);

8. // 创建WebView对象

9. webView_main = (WebView) findViewById(R.id.webView_main);

10. // 获取WebSettings对象

11. webSettings = webView_main.getSettings();

12. // 设置WebView支持运行普通的Javascript

13. webSettings.setJavaScriptEnabled(true);

14. // 设置WebViewClient，保证新的链接地址不打开系统的浏览器窗口

15. webView_main.setWebViewClient(new WebViewClient());

16. // 设置WebChromeClient，以支持运行特殊的Javascript

17. webView_main.setWebChromeClient(new WebChromeClient());

18. // 将一个Java对象绑定到一个Javascript对象中。

19. webView_main.addJavascriptInterface(this, "LoginInfo");

20. // 加载写有Javascript语句的资产目录下网页

21. webView_main.loadUrl("file:///android_asset/LoginInfo.html");

22. }

23. public LoginInfo getLoginInfos() {

24. return new LoginInfo();

25. }

26. // Javascript语句中将调用该类中的内容

27. class LoginInfo {

28. private String username;

29. private String password;

30. public LoginInfo() {

31. this.username = "Wangxiangjun";

32. this.password = "123456789";

33. }

34. public String getUsername() {

35. return username;

36. }

37. public void setUsername(String username) {

38. this.username = username;

39. }

40. public String getPassword() {

41. return password;

42. }

43. public void setPassword(String password) {

44. this.password = password;

45. }

46. }

47.}

图 Javascript调用Android数据效果图

【注意：】
Java代码中也可以直接调用Javascript方法。代码如下：
webView_main.loadUrl("javascript:方法名()");

（六）、用WebView实现“网页版天气预告”

【备注：】调用页面地址：http://m.weather.com.cn/m/pn12/weather.htm?id=101010100T

webView_main = (WebView) findViewById(R.id.webView_main);
webView_main.getSettings().setJavaScriptEnabled(true);
webView_main.setWebChromeClient(new WebChromeClient());
webView_main.setWebViewClient(new WebViewClient());
webView_main.loadUrl("http://m.weather.com.cn/m/pn12/weather.htm?id=101010100T");

（七）、制作简单的网页浏览器：

1、核心代码：

publicclass MainActivity extends Activity {

privateEditText editText_main_url;

privateWebView webView_main;

private String url = "";

@Override

protectedvoid onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

editText_main_url = (EditText) findViewById(R.id.editText_main_url);

webView_main = (WebView) findViewById(R.id.webView_main);

// 让webview对象支持解析javascript语句

webView_main.getSettings().setJavaScriptEnabled(true);

// 让webview对象支持解析alert()等特殊的javascript语句

webView_main.setWebChromeClient(new WebChromeClient());

// 如果不使用该句代码，在点击超链地址后，会跳出程序，而弹出浏览器访问网页。

webView_main.setWebViewClient(new WebViewClient());

}

publicvoid clickButton(View view) {

switch (view.getId()) {

// 浏览器中后退键监听

caseR.id.button_main_goback:

webView_main.goBack();

break;

// 浏览器前进键监听

caseR.id.button_main_goforward:

webView_main.goForward();

break;

// 当输入网址后，点击该按钮，可以执行访问

caseR.id.button_main_submit:

url = editText_main_url.getText().toString();

if ((url == null) || url.equals("")) {

Toast.makeText(MainActivity.this, "请输入url地址！", Toast.LENGTH_LONG).show();

} else {

if (url.indexOf("http://") != 0) {

url = "http://" + url;

}

webView_main.loadUrl(url);

}

break;

// 浏览器停止加载键监听

caseR.id.button_main_stop:

webView_main.stopLoading();

break;

// 浏览器刷新键监听

default:

break;

}

}

}

【备注：】MIME【了解】

1. 概念：MIME意为多功能Internet邮件扩展，它设计的最初目的是为了在发送 电子邮件时附加多媒体数据，让邮件客户程序能根据其类型进行处理。然而当它被HTTP协议支持之后，它的意义就更为显著了。它使得HTTP传输的不仅是普通的文本，而变得丰富多彩。
2. 每个MIME类型由两部分组成，前面是数据的大类别，例如声音audio、图象image等，后面定义具体的种类。
3. 常见的MIME类型(通用型)：

• 超文本标记语言文本 .html text/html
• xml文档 .xml text/xml
• XHTML文档 .xhtml application/xhtml+xml
• 普通文本 .txt text/plain
• RTF文本 .rtf application/rtf
• PDF文档 .pdf application/pdf
• Microsoft Word文件 .word application/msword
• PNG图像 .png image/png
• GIF图形 .gif image/gif
• JPEG图形 .jpeg,.jpg image/jpeg
• au声音文件 .au audio/basic
• MIDI音乐文件 mid,.midi audio/midi,audio/x-midi
• RealAudio音乐文件 .ra, .ram audio/x-pn-realaudio
• MPEG文件 .mpg,.mpeg video/mpeg
• AVI文件 .avi video/x-msvideo
• GZIP文件 .gz application/x-gzip
• TAR文件 .tar application/x-tar
• 任意的二进制数据 application/octet-stream