摘要
作爲Android開發者，我們都知道在手機中內置了一款高性能 webkit 內核瀏覽器,在 SDK 中封裝爲一個叫做 WebView 組件。今天就爲大家講講Android中WebView的詳細使用方法
本文原創，轉載請註明地址：http://blog.kymjs.com/
作爲Android開發者，我們都知道在手機中內置了一款高性能 webkit 內核瀏覽器,在 SDK 中封裝爲一個叫做 WebView 組件。
在開發過程中應該注意幾點:
1.這是最基本的 AndroidManifest.xml 中必須添加訪問網絡權限。
2.如果訪問的頁面中有 Javascript,則 WebView 必須設置支持 Javascript。
-
WebView.getSettings().setJavaScriptEnabled(true);
3.如果頁面中鏈接,如果希望點擊鏈接繼續在當前browser中響應,而不是新開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()方法了,同樣我們可以在此對象中定義很多方法(比如發短信,調用聯繫人列表等手機系統功能),這裏 wave()方法是 java 中調用 javascript 的例子.
需要說明一點:addJavascriptInterface方法中要綁定的Java對象及方法要運行另外的線程中,不能運行在構造他的線程中,這也是使用 Handler 的目的.
深入使用WebView
讓js調用Android代碼
-
首先簡述 WebView、WebViewClient、WebChromeClient 之間的區別:
在 WebView 的設計中,不是什麼事都要 WebView類乾的,有些雜事是分給其他人的,這樣 WebView 專心幹好 自己的解析、渲染工作就行了.WebViewClient 就是幫助 WebView 處理各種通知、請求事件等 ,WebChromeClient 是輔助 WebView 處理 Javascript 的對話框,網站圖標,網站 title.
-
功能實現:
利用 android 中的 WebView 加載一個 html 網頁,在 html 網頁中定義一個按鈕,點擊按鈕彈出一 個 toast.
-
實現步驟:
首先定義一個接口類,將上下文對象傳進去,在接口類中定義要在 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 兩個文件夾（我的手機沒有root，就不截圖了）。
請求的 url 記錄是保存在 WebViewCache.db,而 url 的內容是保存在 WebViewCache 文件夾下. 大家可以自己動手試一下,定義一個html文件,在裏面顯示一張圖片,用WebView加載出來,然後再試着從緩存裏把這張圖片讀取出來並顯示 .
WebView 刪除緩存
其實已經知道緩存保存的位置了，那麼刪除就很簡單了，獲取到這個緩存，然後刪掉他就好了。
//刪除保存於手機上的緩存
-
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;
-
}
是否啓用緩存功能也是可以控制的
-
-
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 WebViewActivity extends Activity {
-
private Handler handler = new Handler() {
-
public void handleMessage(Message msg) {
-
if(msg.what==404) {
-
-
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();
-
-
view.loadUrl("file:///android_asset/404.html");
-
}else{
-
view.loadUrl(url);
-
}
-
return true;
-
}
-
});
-
new Thread(new Runnable() {
-
public void run() {
-
Message msg = new Message();
-
-
-
-
if(getRespStatus(HOMEPAGE)==404) {
-
msg.what = 404;
-
}
-
handler.sendMessage(msg);
-
}).start();
-
}
-
}
