引用:風雲玨悅博客
在專案中經常會使用到WebView控制項,當載入html頁面時,會在/data/data/應用package目錄下生成database與cache兩個資料夾如下圖如示:
2011102816322076.png    
請求的url記錄是保存在webviewCache.db,而url的內容是保存在webviewCache資料夾下.



為了便於理解,接下來類比一個案例,定義一個html檔,在裡面顯示一張圖片,用WebView載入出來,然後再試著從緩存裡把這張圖片讀取出來並顯示。



第一步:新建一個Android工程命名為WebViewCache.目錄結構如下:
2011102816385653.png  


第二步:在assets目錄下新建一個html檔,命名為index.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>WebViewCacheDemo</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
<img src="http://img04.taobaocdn.com/imgextra/i4/608825099/T2nGXBXXpaXXXXXXXX_!!608825099.jpg_310x310.jpg"/>
</body>
</html>




第三步:修改main.xml佈局檔,一個WebView控制項一個Button(點擊載入緩存圖片用),代碼如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent">
<WebView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/webView"/>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="從緩存讀取圖片"
android:id="@+id/button"/>
</LinearLayout>




第四步:修改主核心程式WebViewCacheDemo.java,這裡我只載入了index.html檔,按鈕事件暫時沒寫,代碼如下:

package com.ljq.activity;
import java.io.File;
import java.io.FileInputStream;
import android.app.Activity;
import android.app.Dialog;
import android.app.AlertDialog.Builder;
import android.content.DialogInterface;
import android.content.DialogInterface.OnClickListener;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.view.View;
import android.webkit.WebView;
import android.widget.Button;
import android.widget.ImageView;
public class WebViewActivity extends Activity {
private WebView webView;
private static final String url="file:///android_asset/index.html";
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
webView=(WebView)findViewById(R.id.webView);
webView.loadUrl(url);
}
}




第五步:在AndroidMainifest.xml檔中加訪問網路的許可權:

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


運行效果如下:
2011102816462284.png  


此時我們在WebViewCache.db裡的cache.table裡多了一條記錄如下圖所示:
2011102816492336.gif  


在cache/webviewCache/目錄下多了一個10d8d5cd檔,剛好和cache.table裡的filepath,我們可以斷定這個檔就是我們從網上拽下來的圖片:
2011102816532897.png  


為了驗證猜想,我給Button增加事件回應,就是彈出Dialog,裡面載入緩存的圖片,完整代碼如下:

package com.ljq.activity;
import java.io.File;
import java.io.FileInputStream;
import android.app.Activity;
import android.app.Dialog;
import android.app.AlertDialog.Builder;
import android.content.DialogInterface;
import android.content.DialogInterface.OnClickListener;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.view.View;
import android.webkit.WebView;
import android.widget.Button;
import android.widget.ImageView;
public class WebViewActivity extends Activity {
private WebView webView;
private static final String url="file:///android_asset/index.html";
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
webView=(WebView)findViewById(R.id.webView);
webView.loadUrl(url);
//點擊按鈕時彈出對話方塊
Button button=(Button)findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
ImageView imageView=new ImageView(WebViewActivity.this);
imageView.setImageBitmap(getPictureFromCache());
Builder builder=new android.app.AlertDialog.Builder(WebViewActivity.this);
//設置對話方塊的圖示
builder.setTitle("從緩存查看圖片");
builder.setView(imageView);
//退出按鈕
builder.setPositiveButton("退 出", new OnClickListener(){
public void onClick(DialogInterface dialog, int which) {
//關閉alert對話方塊架
dialog.cancel();
}
});
builder.create().show();
}
});
}
/**
* 從緩存獲取圖片
*
* @return
*/
private Bitmap getPictureFromCache(){
Bitmap bitmap=null;
try {
//這裡寫死,在實際開發專案中要靈活使用
File file=new File(getCacheDir()+"/webviewCache/10d8d5cd");
FileInputStream inStream=new FileInputStream(file);
bitmap=BitmapFactory.decodeStream(inStream);
} catch (Exception e) {
e.printStackTrace();
}
return bitmap;
}
}




第六步:再次運行工程,點擊button按鈕,效果如下圖所示:

2011102816532897.png  

Posted by shadow at 痞客邦 PIXNET 留言(0) 引用(0) 人氣()