正文
作为Android开发者 ,我们都知道安卓手机上内置了一款高性能的webkit内核浏览器,在android SDK中封装了一个叫WebView的控件。
在应用开发过程中我们应该需要注意几点:
1.在AndroidManifest.xml文件中添加相应的权限。
2.如果访问的页面中有JavaScript,则需要设置webview 支持JavaScript。
WebView.getSettings().setJavaScriptEnabled(true);
3.如果页面中链接,希望点击链接继续在当前的浏览器中响应,而不是重新打开android系统的browser中响应该链接,必须覆盖WebView的WebViewClient对象。
mWebView.setWebViewClient(new WebViewClient(){
public boolean shouldOverrideUrlLoading(WebView view, String url){
view.loadUrl(url);
return true;
}
});
4. 如果不做任何处理,浏览页面, 点击系统“Back”键,整个Browser会调用finish()方法来结束自身,如果希望浏览的页面回退而不是推出整个浏览器,需要在当前的Activity中处理并消费掉当前Back事件。
public boolean onKeyDown(int keyCode, KeyEvent event) {
if ((keyCode == KEYCODE_BACK) && mWebView.canGoBack()) {
mWebView.goBack();
return true;
}
return super.onKeyDown(keyCode, event);
}
与JS交互
既然可以显示网页,那么当前也是可以让网页操作本地方法。
public class WebViewDemo extends Activity {
private WebView mWebView;
private Handler mHandler = new Handler();
public void onCreate(Bundle icicle) {
setContentView(R.layout.WebViewdemo);
mWebView = (WebView) findViewById(R.id.WebView);
WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
mWebView.addJavascriptInterface(new Object() {
public void clickOnAndroid() {
mHandler.post(new Runnable() {
public void run() {
mWebView.loadUrl("javascript:wave()");
}
});
}
}, "demo");
mWebView.loadUrl("file:///android_asset/demo.html");
}
}
我们看到 addJavascriptInterface(Object obj,String interfaceName) 这个方法,该方法将一个Java对象绑定到一个JavaScript对象中,JavaScript对象名就是
interfaceName(demo) ,作用域是Global,这样初始化了WebView后, 在WebView加载的页面中就可以直接通过JavaScript:window.demo访问到绑定的Java对象, 来看看HTML 中是怎么调用的。
<html>
<script language="javascript">
function wave() {
document.getElementById("droid").src="android_waving.png";
}
</script>
<body>
<a onClick="window.demo.clickOnAndroid()">
<img id="droid" src="android_normal.png" mce_src="android_normal.png"/><br> Click me! </a>
</body>
</html>
这样在JavaScript中就可以调用Java对象的clickOnAndroid()方法了, 同样我们可以在此对象中定义很多方法(比如:发短信,调用联系人列表等系统功能)。
需要说明一点:addJavascriptInterface()方法中要绑定的Java对象及方法要运行另外的线程中,不能运行在构造他线程中, 这也是使用Handle的目的。
深入使用WebView
让JS调用android代码
1.首先简书一下WebView,WebViewClient , WebChromeClient 之间的区别。
在WebView的设计中, 不是什么事都要WebView类来做的,有些杂事是分给其他人的,这样WebView专心做好自己的解析渲染工作就行了,WebViewClient 就是帮助WebView来处理各种通知,请求事件等,WebChromeClient 是辅助WebView处理JavaScript的对话框,网站图标,网站标题,
2.功能实现:
利用android中的webview 加载一个HTML网页,网页中自定义一个按钮,点击按钮弹出一个Toast.
3.实现步骤:
首先定义一个接口类,将上下文对象传进去,在接口类中定义要在 js 中实现的方法。
接着在assets资源包下定义一个 html 文件,在文件中定义一个 button.button 的点击事件定义为一个 js 函数.
之后在 xml 中定义一个 WebView 组件,在活动类中获取 WebView 并对 WebView 参数进行设置,此处特别注意要设置 WebView 支持 js 且将定义的 js 接口类添加到 WebView 中去,此后在 js 中就可以利用该接口类中定义的 函数了.即:
myWebView.getSettings().setJavaScriptEnabled(true);
myWebView.addJavascriptInterface(new JavaScriptinterface(this),”android”);
最后利用 WebView 加载本地 html 文件的方法是:
myWebView.loadData(htmlText,"text/html", "utf-8");
此处的htmltext 是以字符串的方式读取 assets 报下 html中的内容.
4. 实现利用返回键返回到上一页:
设置 WebView 的按键监听,监听到期返回键并判断网页是否能够返回 ,利用 WebView 的 goBack()返回到上一页.
WebView 缓存
在项目中使用到Webview 控件,当加载HTML页面时, 会在/data/data/应用包名目录下生成database 和 cache 两个文件夹。
请求的URL 记录是保存在WebViewCache.db , 而URL的内容是保存在WebViewCache文件夹下。
WebView 删除缓存
其实已经知道缓存的目录保存位置后, 那么删除就很简单了, 获取到这个缓存,然后删除就OK了。
// 删除保存在手机上的缓存。
private int clearCacheFolder(File dir,long numDays) {
int deletedFiles = 0;
if (dir!= null && dir.isDirectory()){
try {
for (File child:dir.listFiles()){
if (child.isDirectory()) {
deletedFiles += clearCacheFolder(child, numDays);
}
if (child.lastModified() < numDays) {
if (child.delete()) {
deletedFiles++;
}
}
}
} catch(Exception e) {
e.printStackTrace();
}
}
return deletedFiles;
}
是否启用缓存功能也是可以控制的:
<span > </span>//优先使用缓存:
WebView.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
//不使用缓存:
WebView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);
在退出应用的时候加上如下代码, 可以完整的清空缓存。
File file = CacheManager.getCacheFileBaseDir();
if (file != null && file.exists() && file.isDirectory()) {
for (File item : file.listFiles()) {
item.delete();
}
file.delete();
}
context.deleteDatabase("WebView.db");
context.deleteDatabase("WebViewCache.db");
WebView 处理404错误
显示网页有时候会遇到一个问题, 就是网页有可能会找不到, WebView当然也是可以处理的。
public class WebView_404 extends Activity {
private Handler handler = new Handler() {
public void handleMessage(Message msg) {
if(msg.what==404) {//主页不存在
//载入本地 assets 文件夹下面的错误提示页面 404.html
web.loadUrl("file:///android_asset/404.html");
}else{
web.loadUrl(HOMEPAGE);
}
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
web.setWebViewClient(new WebViewClient() {
public boolean shouldOverrideUrl(WebView view,String url) {
if(url.startsWith("http://") && getRespStatus(url)==404) {
view.stopLoading();
//载入本地 assets 文件夹下面的错误提示页面 404.html
view.loadUrl("file:///android_asset/404.html");
}else{
view.loadUrl(url);
}
return true;
}
});
new Thread(new Runnable() {
public void run() {
Message msg = new Message();
//此处判断主页是否存在,因为主页是通过 loadUrl 加载的,
//此时不会执行 shouldOverrideUrlLoading 进行页面是否存在的判断 //进入主页后,点主页里面的链接,链接<span > </span>到其他页面就一定会执行
shouldOverrideUrlLoading 方法了
if(getRespStatus(HOMEPAGE)==404) {
msg.what = 404;
}
handler.sendMessage(msg);
}).start();
}
}
判断WebView是否已经滚动到页面底部
在view中有一个getScrollY()方法, 可以返回当前可见区域的顶端距整个页面的距离, 也就是当前内容滚动的距离。
还有getHeight() 或者 getBottom() 方法 都可以返回当前View 这个容器的高度。
在View 中还有getContentHeight()方法来返回整个Html 页面的高度,但,并不等于就是当前整个页面的高度,因为WebView有缩放功能, 你可以设置如下代码来启动或者关闭webview的缩放功能。
<span style="font-size:18px;">mWebView.getSettings().setSupportZoom(true);
mWebView.getSettings().setBuiltInZoomControls(true);</span>
所以当前整个页面的高度实际上应该就是原始HTML的高度再乘以缩放比例,因此更正之后的结果,准确的判断方法应该就是:
// 如果已经处于底端
if(WebView.getContentHeight*WebView.getScale() -(webvi ew.getHeight()+WebView.getScrollY())){
//XXX
}