1. 简介
WebView是一个基于webkit引擎、展现web页面的控件。
Android的Webview在低版本和高版本采用了不同的webkit版本内核,4.4后直接使用了Chrome。
2. 作用
显示和渲染Web页面
直接使用html文件(网络上或本地assets中)作布局
可和JavaScript交互调用
WebView控件功能强大,除了具有一般View的属性和设置外,还可以对url请求、页面加载、渲染、页面交互进行强大的处理。
3. 使用介绍
一般来说Webview可单独使用,可联合其子类一起使用,所以接下来,我会介绍:
Webview自身的常见方法;
Webview的最常用的子类
(WebSettings类、WebViewClient类、WebChromeClient类)
Android和Js的交互
3.1 Webview常用方法
我们都知道在Android上可以通过WebView加载网页,但是能否加载html的源码呢?答案是肯定的。一般条件下,我们可以在WebView上加载html的代码。
3.1.1 加载url
html文件
WebView wView = (WebView)findViewById(R.id.wv1);
WebSettings wSet = wView.getSettings();
wSet.setJavaScriptEnabled(true);
//打开本包内asset目录下的index.html文件
wView.loadUrl("file:///android_asset/index.html");
// 打开本地sd卡内的index.html文件
wView.loadUrl("content://com.android.htmlfileprovider/sdcard/index.html");
// 打开指定URL的html文件
wView.loadUrl("http://wap.baidu.com");
使用 LoadData 或者 loadDataWithBaseURL方法加载html代码
有时候我们的webview可能只是html片段,而不是一个完整的网页,事实上绝大多数时候都是如此,完整的网页无需做成应用,而直接在浏览器访问。
这种情况我们使用 LoadData 或者 loadDataWithBaseURL方法,后者用的最多:
void loadDataWithBaseURL (String baseUrl, String data, String mimeType, String encoding, String historyUrl)
loadDataWithBaseURL()比loadData()多两个参数,可以指定HTML代码片段中相关资源的相对根路径,也可以指定历史Url,其余三个参数相同。
这里主要注意参数baseUrl,baseUrl指定了你的data参数中数据是以什么地址为基准的,因为data中的数据可能会有超链接或者是image元素,而很多网站的地址都是用的相对路径,如果没有baseUrl,webview将访问不到这些资源。
String content="<p><fontcolor='red'>hellobaidu!</font></p>";
webview.loadDataWithBaseURL(null,content,"text/html","UTF-8",null);//加载定义的代码,并设定编码格式和字符集。
添加css样式拼接html
实现新闻详情页面
String linkCss = "<style type=\"text/css\"> " +
"img {" +
"width:100%;" +
"height:auto;" +
"}" +
"body {" +
"margin-right:15px;" +
"margin-left:15px;" +
"margin-top:15px;" +
"font-size:45px;" +
"}" +
"</style>";
String html = "<html><header>" + linkCss + "</header>" + content + "</body></html>";
webView.loadData(html, "text/html", "uft-8");
//或者可以直接linkcss
String linkCss="<link href="file:///android_asset/目录/style.css" rel="stylesheet" type="text/css" media="all">"