Android使用WebView實(shí)現(xiàn)離線閱讀功能
1、先看效果圖,加載動(dòng)畫(huà):
加載完成,注意當(dāng)前為飛行模式!
2、使用
1)、讓你的javabean實(shí)現(xiàn)OffLineLevelItem接口,因?yàn)槲业倪@個(gè)離線閱讀支持多級(jí)下載,比如Demo中的每個(gè)頻道下面的第一頁(yè)item都可以緩存。
package com.zgh.offlinereader; import java.util.List; public interface OffLineLevelItem { //是否有下一級(jí) boolean haveNextLevel(); //內(nèi)容url String getWebUrl(); //下一級(jí)的url String getNextLevelListUrl(); //生成下一級(jí) List<OffLineLevelItem> getNextLevelList(String jsonStr); } public class Channel implements OffLineLevelItem { String title; String url; public String getTitle() { return title; } public void setTitle(String title) { this.title = title; } public String getUrl() { return url; } public void setUrl(String url) { this.url = url; } @Override public boolean haveNextLevel() { return true; } @Override public String getWebUrl() { return null; } @Override public String getNextLevelListUrl() { return url; } @Override public List<OffLineLevelItem> getNextLevelList(String jsonStr) { List<OffLineLevelItem> items = GsonUtil.jsonToBeanList(jsonStr, NewsItem.class); return items; } }
2)、初始化
OfflineReaderServer.init(this, getCacheDir(), new MyFirstLevel(),new WaterWaveProgressUI(this));
3)、啟動(dòng)
@Override public void onClick(View v) { Intent intent=new Intent(this, OfflineReaderServer.class); startService(intent); }
4)、記得在你的webview使用前調(diào)用
//設(shè)置緩存目錄 WebViewHelper.setWebViewConfig(webView);
就這么簡(jiǎn)單!
實(shí)現(xiàn)
首先我們?yōu)槭裁匆褂脀ebview實(shí)現(xiàn)離線閱讀,因?yàn)楹?jiǎn)單。webview自帶的緩存機(jī)制可以實(shí)現(xiàn)圖片,js,css的緩存。不然你自己得實(shí)現(xiàn)數(shù)據(jù)庫(kù),html下載,js下載,css保存,html的拼裝。下面我將講解一些webview設(shè)置緩存,實(shí)現(xiàn)多級(jí)下載,webview遍歷url,webview顯示完成監(jiān)聽(tīng)。
1.WebView設(shè)置緩存
這一部分比較簡(jiǎn)單,主要是緩存目錄的設(shè)置,然后設(shè)置緩存模式為:
WebSettings.LOAD_CACHE_ELSE_NETWORK
這種模式下webview會(huì)優(yōu)先加載本地緩存,如果沒(méi)有緩存的話再加載網(wǎng)絡(luò)。
mWebView.getSettings().setRenderPriority(WebSettings.RenderPriority.HIGH); // 建議緩存策略為,判斷是否有網(wǎng)絡(luò),有的話,使用LOAD_DEFAULT,無(wú)網(wǎng)絡(luò)時(shí),使用LOAD_CACHE_ELSE_NETWORK mWebView.getSettings().setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK); // 設(shè)置緩存模式 // 開(kāi)啟DOM storage API 功能 mWebView.getSettings().setDomStorageEnabled(true); // 開(kāi)啟database storage API功能 mWebView.getSettings().setDatabaseEnabled(true); // String cacheDirPath = getFilesDir().getAbsolutePath() // + APP_CACHE_DIRNAME; String cacheDirPath = ConfigUtil.getCacheDir() + APP_CACHE_DIRNAME; Log.i(TAG, "cachePath=" + cacheDirPath); // 設(shè)置數(shù)據(jù)庫(kù)緩存路徑 mWebView.getSettings().setDatabasePath(cacheDirPath); // API 19 deprecated // 設(shè)置Application caches緩存目錄 mWebView.getSettings().setAppCachePath(cacheDirPath); // 開(kāi)啟Application Cache功能 mWebView.getSettings().setAppCacheEnabled(true); mWebView.getSettings().setAppCacheMaxSize(MAX_SIZE);
2.多級(jí)緩存
我的項(xiàng)目中需要將每個(gè)頻道的首頁(yè)中的每個(gè)item都緩存下來(lái),所以涉及到多級(jí)緩存于是我設(shè)計(jì)了一個(gè)接口在離線閱讀的時(shí)候最重要的是拿到葉子節(jié)點(diǎn)也就是每個(gè)item的url地址,如果是每葉子節(jié)點(diǎn)也就是haveNextLevel()返回true的時(shí)候就調(diào)用getNextLevelListUrl獲取下一級(jí)的url,一般都是Jason字符串,再把json字符串傳入getNextLevelList()方法獲取下一級(jí),如果到達(dá)葉子節(jié)點(diǎn),則調(diào)用getWebUrl()獲取url地址保存在一個(gè)集合中,當(dāng)所有的url都獲取以后,就開(kāi)始用webview遍歷url實(shí)現(xiàn)緩存。
public interface OffLineLevelItem { //是否有下一級(jí) boolean haveNextLevel(); //內(nèi)容url String getWebUrl(); //下一級(jí)的url String getNextLevelListUrl(); //生成下一級(jí) List<OffLineLevelItem> getNextLevelList(String jsonStr); }
頻道的javabean
public class Channel implements OffLineLevelItem { String title; String url; public String getTitle() { return title; } public void setTitle(String title) { this.title = title; } public String getUrl() { return url; } public void setUrl(String url) { this.url = url; } @Override public boolean haveNextLevel() { return true; } @Override public String getWebUrl() { return null; } @Override public String getNextLevelListUrl() { return url; } @Override public List<OffLineLevelItem> getNextLevelList(String jsonStr) { List<OffLineLevelItem> items = GsonUtil.jsonToBeanList(jsonStr, NewsItem.class); return items; } }
item的javabean
public class NewsItem implements OffLineLevelItem{ String title; String url; public String getTitle() { return title; } public void setTitle(String title) { this.title = title; } public String getUrl() { return url; } public void setUrl(String url) { this.url = url; } @Override public String toString() { return title; } @Override public boolean haveNextLevel() { return false; } @Override public String getWebUrl() { return url; } @Override public String getNextLevelListUrl() { return null; } @Override public List<OffLineLevelItem> getNextLevelList(String jsonStr) { return null; } }
當(dāng)然為了獲取到頻道列表需要一個(gè)第一級(jí)的目錄,而這個(gè)目錄在初始化的時(shí)候就設(shè)置進(jìn)去了。
public class MyFirstLevel implements OffLineLevelItem { @Override public boolean haveNextLevel() { return true; } @Override public String getWebUrl() { return null; } @Override public String getNextLevelListUrl() { return "raw://news_list"; } @Override public List<OffLineLevelItem> getNextLevelList(String jsonStr) { List<OffLineLevelItem> items = GsonUtil.jsonToBeanList(jsonStr, Channel.class); return items; } }
3.使用WebView遍歷URL,我原來(lái)的思路是給webview設(shè)置WebViewClient然后重寫(xiě)onPageFinished方法,在這個(gè)方法中獲取下一個(gè)需要換成的url,然后再調(diào)用webview.loadurl()結(jié)果是很多頁(yè)面加載出來(lái)是空的。而且在Android4.4以上onPageFinished會(huì)調(diào)用兩次
于是乎,我重寫(xiě)了WebView的OnDraw()方法,在OnDraw()方法里設(shè)置了一個(gè)監(jiān)聽(tīng)回調(diào),但是由于我的WebView是在Service中創(chuàng)建的所以ondraw方法根本不會(huì)調(diào)用,但是這難得的我嗎?,呵呵,于是我在service的onCreat方法中使用WindowManger將webview添加到屏幕,長(zhǎng)寬都是一個(gè)像素
@Override public void onCreate() { super.onCreate(); if (!haveInit) { throw new RuntimeException("請(qǐng)先調(diào)用init()方法,初始化OfflineReaderServer"); } windowManager = (WindowManager) getSystemService(Context.WINDOW_SERVICE); params=new WindowManager.LayoutParams(); params.type = WindowManager.LayoutParams.TYPE_TOAST; params.flags = WindowManager.LayoutParams.FLAG_NOT_TOUCH_MODAL | WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE; params.gravity = Gravity.LEFT | Gravity.TOP; params.width = 1; params.height = 1; initWebView(); windowManager.addView(mWebView,params); }
結(jié)果還是很明顯的大部分的頁(yè)面都能緩存下來(lái),但是任然有部分頁(yè)面是空白的,后來(lái)發(fā)現(xiàn)webview的OnDraw()方法會(huì)多次持續(xù),webview的頁(yè)面加載時(shí)間隙的,我通過(guò)getContentHeight()判斷內(nèi)容高度來(lái)實(shí)現(xiàn)顯示完成的監(jiān)聽(tīng),結(jié)果任然不理想。于是我最終版是這樣的
/** * 可以監(jiān)聽(tīng)顯示完成的webview */ public class LoadWebView extends WebView { private boolean isRendered = false; private static final int MSG_FINISH=1; private static final int MIN_CONTENT_HEIGHT=1000; public LoadWebView(Context context) { this(context, null); } public LoadWebView(Context context, AttributeSet attrs) { super(context, attrs); } private int contentHeight=MIN_CONTENT_HEIGHT; Handler handler=new Handler(Looper.getMainLooper()){ @Override public void handleMessage(Message msg) { if(msg.what==MSG_FINISH) { if (finishListenter != null) { finishListenter.onFinish(); contentHeight=MIN_CONTENT_HEIGHT; } } } }; @Override protected void onDraw(Canvas canvas) { //與上一次的contentHeight比較,如果比上一次大,說(shuō)明還在加載 if(getContentHeight()>=contentHeight){ //更新contentHeight contentHeight=getContentHeight(); //取消消息 handler.removeMessages(MSG_FINISH); //延遲200ms發(fā)送,如果在200ms內(nèi)webview又加載了則這條消息會(huì)被取消,知道webview加載完成, //這條消息會(huì)被發(fā)送,所以每離線一個(gè)頁(yè)面有200ms的延遲,但是與功能相比這點(diǎn)是可以接受的。 handler.sendEmptyMessageDelayed(MSG_FINISH,200); } } public interface OnLoadFinishListenter{ void onFinish(); } private OnLoadFinishListenter finishListenter; public void setFinishListenter(OnLoadFinishListenter listenter){ finishListenter=listenter; } }
3、進(jìn)度提示
為了讓用戶知道離線的進(jìn)度我抽取出了一個(gè)接口
public interface OffLineProgressUI { void showProgress(); void closeProgress(); void updateProgress(int progress); }
并默認(rèn)實(shí)現(xiàn)了一個(gè)水波紋的進(jìn)度球
設(shè)置進(jìn)度提示有兩種方式,一種是在初始化的時(shí)候設(shè)置
OfflineReaderServer.init(this, getCacheDir(), new MyFirstLevel(),new WaterWaveProgressUI(this));
還有一種是調(diào)用OfflineReaderServer的setProgressUI方法
public static void setProgressUI(@NonNull OffLineProgressUI progressUI) { sProgressUI = progressUI; }
源碼地址:
https://github.com/zhuguohui/OffLineReaderDem
以上就是Android使用WebView實(shí)現(xiàn)離線閱讀功能的詳細(xì)內(nèi)容,更多關(guān)于Android 實(shí)現(xiàn)離線閱讀功能的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章!
- Android WebView如何判定網(wǎng)頁(yè)加載的錯(cuò)誤
- Android webView字體突然變小的原因及解決
- Android 解決WebView多進(jìn)程崩潰的方法
- Android 中 WebView 的基本用法詳解
- 在Android環(huán)境下WebView中攔截所有請(qǐng)求并替換URL示例詳解
- 解決Android webview設(shè)置cookie和cookie丟失的問(wèn)題
- Android 如何從零開(kāi)始寫(xiě)一款書(shū)籍閱讀器的示例
- Android實(shí)現(xiàn)閱讀進(jìn)度記憶功能
- android閱讀器長(zhǎng)按選擇文字功能實(shí)現(xiàn)代碼
- android仿新聞閱讀器菜單彈出效果實(shí)例(附源碼DEMO下載)
- Android實(shí)現(xiàn)閱讀APP平移翻頁(yè)效果
- Android編程實(shí)現(xiàn)小說(shuō)閱讀器滑動(dòng)效果的方法
相關(guān)文章
Android實(shí)現(xiàn)局部圖片滑動(dòng)指引效果示例
現(xiàn)在滑動(dòng)效果用的比較多,尤其是在手機(jī)端上面,本文介紹了Android實(shí)現(xiàn)局部圖片滑動(dòng)指引效果示例,現(xiàn)在就分享給大家,也給大家做個(gè)參考。2016-10-10淺談Android AsyncTask內(nèi)存安全的一種使用方式
這篇文章主要介紹了淺談Android AsyncTask內(nèi)存安全的一種使用方式,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-08-08Android Support Annotations資料整理
這篇文章主要介紹了Android Support Annotations資料整理的相關(guān)資料,需要的朋友可以參考下2017-05-05Android ViewPager相冊(cè)橫向移動(dòng)的實(shí)現(xiàn)方法
本篇文章小編為大家介紹,Android ViewPager相冊(cè)橫向移動(dòng)的實(shí)現(xiàn)方法。需要的朋友參考下2013-04-04Android TreeView效果實(shí)現(xiàn)方法(附demo源碼下載)
這篇文章主要介紹了Android TreeView效果實(shí)現(xiàn)方法,結(jié)合實(shí)例形式分析了Android TreeView效果的實(shí)現(xiàn)原理與具體技巧,并附帶demo源碼供讀者下載,需要的朋友可以參考下2016-02-02詳解android 人臉檢測(cè)你一定會(huì)遇到的坑
這篇文章主要介紹了詳解android 人臉檢測(cè)你一定會(huì)遇到的坑,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-11-11Android中AnimationDrawable使用的簡(jiǎn)單實(shí)例
這篇文章介紹了Android中AnimationDrawable使用的簡(jiǎn)單實(shí)例,有需要的朋友可以參考一下2013-10-10Kotlin by lazy關(guān)鍵字深入探究實(shí)現(xiàn)原理
這篇文章主要介紹了by lazy,在kotlin中使用是很常見(jiàn)的,用于實(shí)現(xiàn)懶加載某個(gè)數(shù)據(jù)。而這兩個(gè)單詞不是一體的,其中by是kotlin中的關(guān)鍵字,用于實(shí)現(xiàn)委托;lazy是一個(gè)方法,他的返回值是委托的具體對(duì)象2022-11-11Android制作登錄頁(yè)面并且記住賬號(hào)密碼功能的實(shí)現(xiàn)代碼
這篇文章主要介紹了Android制作登錄頁(yè)面并且記住賬號(hào)密碼功能的實(shí)現(xiàn)代碼,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-04-04Android實(shí)現(xiàn)傾斜角標(biāo)樣式
最新小編接到這樣一個(gè)項(xiàng)目,需要在一個(gè)距形卡片上做一個(gè)傾斜的Tag,類似支付寶上的一個(gè)功能,接著小編給大家?guī)?lái)了實(shí)現(xiàn)思路,對(duì)android 傾斜角標(biāo)的實(shí)現(xiàn)方法感興趣的朋友跟隨小編一起看看吧2019-10-10