王 結(jié), 魏振鋼

(中國(guó)海洋大學(xué) 信息科學(xué)與工程學(xué)院學(xué)院, 青島 266100)

Android平臺(tái)下快速加載圖文信息的研究與實(shí)現(xiàn)①

王 結(jié), 魏振鋼

(中國(guó)海洋大學(xué) 信息科學(xué)與工程學(xué)院學(xué)院, 青島 266100)

為了加快Android移動(dòng)端圖文信息的加載速度, 方便用戶快速瀏覽界面獲取相關(guān)信息, 在汲取前人的相關(guān)技術(shù)基礎(chǔ)上, 結(jié)合了Android圖像開源視圖smart-Image-View、網(wǎng)絡(luò)請(qǐng)求框架android-async-http以及分頁(yè)顯示技術(shù). 采用大量圖文數(shù)據(jù)做實(shí)驗(yàn), 結(jié)果表明三種方法的結(jié)合使用明顯提高了圖文加載速度.

圖文信息; 加載速度; 圖像開源視圖; 網(wǎng)絡(luò)請(qǐng)求框架; 分頁(yè)顯示

1 引言

隨著Android平臺(tái)的應(yīng)用不斷涌現(xiàn), 為了提高App內(nèi)容的簡(jiǎn)潔直觀性, 開發(fā)者偏向以圖文信息的形式來(lái)布局界面內(nèi)容. 例如目前廣泛受到用戶關(guān)注的購(gòu)物App, QQ、微信等聊天軟件以及各種題庫(kù)軟件等都少不了圖文內(nèi)容的展示. 然而由于數(shù)據(jù)庫(kù)內(nèi)容的不斷增多,在Android端前臺(tái)界面要顯示的圖文信息也愈發(fā)增多.因此, 尋求新的技術(shù)方法來(lái)加快圖文信息的加載速度,增強(qiáng)用戶體驗(yàn)性是非常有必要的.

2 Android圖像開源視圖

Android平臺(tái)的應(yīng)用開發(fā)主要采用MVC框架[1],通過(guò)控制層、模型層以及視圖層之間的通信, 完成對(duì)圖文信息的加載, 具體過(guò)程是Android端前臺(tái)的Activity將用戶的請(qǐng)求信息交于模型業(yè)務(wù)邏輯層(即后臺(tái)相關(guān)的Servlet)處理, 之后Servlet從服務(wù)器中獲取相關(guān)的圖文信息以Json數(shù)據(jù)包[2]形式返回給前臺(tái), 再由前臺(tái)視圖層(即相應(yīng)的XML)處理顯示. 具體的通信過(guò)程如圖1所示.

而圖片在服務(wù)器中的存儲(chǔ)格式一般是字符串形式的URL, 當(dāng)前臺(tái)從Json數(shù)據(jù)包中解析出各種數(shù)據(jù)后,文字可以立即顯示出來(lái), 但由于獲取到的圖片是其URL形式存儲(chǔ)的, 需通過(guò)URL再次訪問(wèn)后臺(tái)來(lái)獲取圖片資源. 這樣不僅使得代碼量繁雜同時(shí)也大大降低了圖片的加載速度.

為了解決圖片和文字加載速度的不同步問(wèn)題, 查閱了相關(guān)的文獻(xiàn)期刊, 先后有AsyncHttpClient框架[3]、用于獲取網(wǎng)絡(luò)圖片的Universal-Image-Loader框架以及Volley網(wǎng)絡(luò)通信框架被推出應(yīng)用到網(wǎng)絡(luò)圖片加載中,表1所示為這三種網(wǎng)絡(luò)通信框架[4]的特點(diǎn)比較.

圖1 Android端MVC通信過(guò)程

表1 三種網(wǎng)絡(luò)通信框架的特點(diǎn)比較

通過(guò)分析比較可以看出這三種網(wǎng)絡(luò)框架都有各自的優(yōu)缺點(diǎn), 應(yīng)用的比較好的是Volley框架, 可以實(shí)現(xiàn)多線程請(qǐng)求, 穩(wěn)定性及高, 同時(shí)還提供緩存功能. 但在只加載圖文信息的具體項(xiàng)目中, 若采用這種框架實(shí)現(xiàn), 空間占用太大, 且代碼存在冗余, 反而使得程序更加復(fù)雜化. 而本文采用的框架是集多線程、緩存機(jī)制、代碼量少于一體的Android圖像視圖控件smart-Image-View[5].

smart-Image-View可以實(shí)現(xiàn)各種來(lái)源的圖片資源獲取. 根據(jù)來(lái)源的不同, smart-Image-View定義了一個(gè)公共接口SmartImage, 用不同的類分別來(lái)實(shí)現(xiàn)該接口下的一個(gè)getBitmap函數(shù). 如圖2所示是smart-Image-View的基本框架.

圖2 smart-Image-View基本框架

將smart-Image-View控件取代ImageView應(yīng)用到圖片加載中, 只需調(diào)用自定義控件SmartImageView的setImageUrl方法, 即可從指定的URL路徑中讀取圖片資源并部署在該控件上.

同時(shí), smart-Image-View通過(guò)WebImage類下的WebImage Cache實(shí)現(xiàn)了圖片的緩存. WebImage類根據(jù)URL獲取資源時(shí), 并不是每次都要從網(wǎng)絡(luò)上加載, 而是實(shí)現(xiàn)了二級(jí)緩存, 即內(nèi)存緩存和磁盤緩存. 每次加載時(shí), 先要判斷該URL對(duì)應(yīng)的圖片是否已存在于緩存中, 若有, 直接從緩存中獲取, 反之, 再?gòu)腢RL上加載. smart-Image-View在圖文內(nèi)容加載上的應(yīng)用使得圖片資源和文字實(shí)現(xiàn)了幾乎同步顯示的效果, 并且節(jié)約了用戶的下載流量和載入時(shí)間.

3 Android網(wǎng)絡(luò)請(qǐng)求框架

Http網(wǎng)絡(luò)數(shù)據(jù)交互請(qǐng)求是Android端應(yīng)用程序開發(fā)關(guān)鍵部分之一, 網(wǎng)絡(luò)請(qǐng)求方式的效率和性能直接影響到App的整體用戶體驗(yàn)流暢性. 以往Android端的網(wǎng)絡(luò)請(qǐng)求處理一般使用Apache HTTP Client或者HttpURLConnect這兩個(gè)類庫(kù), 同時(shí)需要編寫大量的get和post方法完成請(qǐng)求, 并且網(wǎng)絡(luò)請(qǐng)求都會(huì)占用UI線程, 使得其他操作無(wú)法進(jìn)行, 遇到網(wǎng)絡(luò)異常情況還會(huì)出現(xiàn)程序無(wú)響應(yīng)現(xiàn)象. 對(duì)于這些問(wèn)題, 開發(fā)者們提出過(guò)很多的優(yōu)化方案, 譚東等人在《Android網(wǎng)絡(luò)負(fù)載請(qǐng)求優(yōu)化方案設(shè)計(jì)》[6]一文中提出了幾個(gè)網(wǎng)絡(luò)優(yōu)化方法, 創(chuàng)建網(wǎng)絡(luò)請(qǐng)求線程管理池, 使用優(yōu)先級(jí)請(qǐng)求排序策略以及網(wǎng)絡(luò)請(qǐng)求及時(shí)回收等, 都能很好地達(dá)到優(yōu)化效果. 而本文提出的android-async-http[7]開源框架則是集成了這些優(yōu)化思想, 實(shí)現(xiàn)了一個(gè)異步網(wǎng)絡(luò)請(qǐng)求處理庫(kù), 獨(dú)立在UI主線程之外, 通過(guò)線程池的網(wǎng)絡(luò)請(qǐng)求回調(diào)方法處理請(qǐng)求結(jié)果.

將android-async-http應(yīng)用到圖文信息加載上的優(yōu)勢(shì)有幾點(diǎn): 第一, 移動(dòng)端應(yīng)用要考慮到網(wǎng)絡(luò)移動(dòng)連接的不穩(wěn)定性, App在加載圖文信息的過(guò)程中網(wǎng)絡(luò)一旦斷開, 信息將無(wú)法顯示出來(lái), 而android-async-http框架實(shí)現(xiàn)了網(wǎng)絡(luò)的自動(dòng)智能請(qǐng)求重試, 在請(qǐng)求失敗的情況下可以設(shè)置多次請(qǐng)求; 第二, App端向服務(wù)器請(qǐng)求獲取相關(guān)圖文信息時(shí), 利用后臺(tái)Servlet將數(shù)據(jù)打包成Json格式返回給前臺(tái)后, 一般都需要進(jìn)行相當(dāng)費(fèi)時(shí)的一系列格式轉(zhuǎn)換處理才能顯示給用戶瀏覽. 而android-async-http框架內(nèi)置了一個(gè)JsonHttpResponseHandler解析類, 可以實(shí)現(xiàn)自動(dòng)化高效地Json格式數(shù)據(jù)解析, 大大縮短了圖文數(shù)據(jù)從返回前臺(tái)到顯示于界面這一時(shí)間過(guò)程. 第三, android-async-http框架具有持久化cookie存儲(chǔ)的特點(diǎn),在請(qǐng)求服務(wù)器時(shí)能夠?qū)⒃L問(wèn)到的cookie信息方便的存儲(chǔ)起來(lái).

4 分頁(yè)顯示

隨著數(shù)據(jù)庫(kù)技術(shù)在網(wǎng)絡(luò)領(lǐng)域的廣泛應(yīng)用, Android端與數(shù)據(jù)庫(kù)交互信息的顯示方式也在不斷地創(chuàng)新和改進(jìn). 傳統(tǒng)的方法是Android端一次性向后臺(tái)Servlet請(qǐng)求所有相關(guān)圖文信息, Servlet得到命令后從數(shù)據(jù)庫(kù)中獲取所有符合條件的圖文信息并打包成Json數(shù)據(jù)發(fā)送給前臺(tái). 這種方法顯然在數(shù)據(jù)信息較大的情況下使用會(huì)明顯降低加載速度; 之后有了分頁(yè)處理[8]的思想,即利用結(jié)果集處理. 通過(guò)首次執(zhí)行SQL語(yǔ)句, 將查詢結(jié)果存于結(jié)果集對(duì)象中, 之后前臺(tái)的每次請(qǐng)求數(shù)據(jù),實(shí)際上是在結(jié)果集中獲取指定行位置的數(shù)據(jù), 這一過(guò)程雖然減少了對(duì)數(shù)據(jù)庫(kù)SQL語(yǔ)句的查詢, 但數(shù)據(jù)庫(kù)仍要一直保持連接狀態(tài), 使得占用的數(shù)據(jù)庫(kù)訪問(wèn)資源比較多, 而利用率不高. 而針對(duì)Android端請(qǐng)求的圖文信息量大的情況, 本文提出了分頁(yè)顯示技術(shù), 即利用SQL語(yǔ)句處理, 在前臺(tái)界面加載時(shí), 只向后臺(tái)數(shù)據(jù)庫(kù)請(qǐng)求固定行數(shù)的圖文信息, 存于結(jié)果集, 并顯示在列表視圖中, 等到需要查看更多時(shí), 再向數(shù)據(jù)庫(kù)請(qǐng)求加載. 這樣雖然對(duì)數(shù)據(jù)庫(kù)進(jìn)行SQL語(yǔ)句查詢操作變得頻繁, 但數(shù)據(jù)庫(kù)的訪問(wèn)資源使用完畢之后就立即被釋放.

首先在Android端和后臺(tái)模型層分別創(chuàng)建一個(gè)用于傳遞分頁(yè)信息的數(shù)據(jù)包PageBean類, 該類包含了分頁(yè)的具體信息(如數(shù)據(jù)總行數(shù), Android端當(dāng)前顯示頁(yè)號(hào), 總顯示頁(yè)數(shù), 每頁(yè)顯示行數(shù))和分頁(yè)數(shù)據(jù)(每頁(yè)中顯示的List數(shù)據(jù)集), 前臺(tái)向后臺(tái)模型層傳遞每頁(yè)顯示的行數(shù)和當(dāng)前顯示頁(yè)號(hào), 后臺(tái)相應(yīng)Servlet通過(guò)doPost方法接收前臺(tái)傳遞來(lái)的數(shù)據(jù)參數(shù)后, 調(diào)用實(shí)現(xiàn)DAO接口的具體類的方法訪問(wèn)數(shù)據(jù)庫(kù), 獲取相關(guān)信息打包存于PageBean類的對(duì)象中, 以Json包的形式返回給前臺(tái).該過(guò)程的具體實(shí)現(xiàn)如圖3所示.

圖3 Android端分頁(yè)顯示具體實(shí)現(xiàn)過(guò)程

該過(guò)程中使用了數(shù)據(jù)訪問(wèn)模型[9,10](Data Access Object), 它是處于業(yè)務(wù)邏輯層與數(shù)據(jù)源之間的一種抽象數(shù)據(jù)源, 通過(guò)DAO層的抽象, 將具體的業(yè)務(wù)邏輯層和數(shù)據(jù)源區(qū)分開, 其實(shí)質(zhì)是向外部提供了一個(gè)訪問(wèn)數(shù)據(jù)源的統(tǒng)一接口, 對(duì)外隱藏操作數(shù)據(jù)源的實(shí)現(xiàn)細(xì)節(jié),從而提高軟件的可維護(hù)性.

5 具體實(shí)現(xiàn)

在前臺(tái)界面XML文件中引用了smart-Image-View圖像開源視圖作為圖片的顯示容器. 實(shí)驗(yàn)結(jié)果顯示前臺(tái)讀取商品信息時(shí), 文字和圖片幾乎是同時(shí)加載出來(lái)的, 說(shuō)明圖片的加載速度有了明顯的提高. 圖4和圖5所示為用ImageView視圖容器和smart-Image-View視圖容器加載圖片的效果顯示. 從中可以明顯看出使用smart-Image-View的優(yōu)勢(shì).

而在App端應(yīng)用android-async-http網(wǎng)絡(luò)請(qǐng)求框架也是比較簡(jiǎn)便的, 首先需要將該框架的jar包添加到Android應(yīng)用程序libs文件中, 再創(chuàng)建一個(gè)AsyncHttpClient對(duì)象, 并通過(guò)RequestParams對(duì)象設(shè)置請(qǐng)求參數(shù), 然后調(diào)用Async -HttpClient的某個(gè)get或post方法, 傳遞你需要的callback接口實(shí)現(xiàn)AsyncHttpResponseHandler. 實(shí)現(xiàn)代碼如圖6所示.

圖4 ImageView視圖 容器加載的效果

圖5 smart-Image-View 視圖容器加載的效果

圖6 android-async-http框架的具體代碼實(shí)現(xiàn)

代碼中HttpUtil是一個(gè)自定義的網(wǎng)絡(luò)請(qǐng)求工具類,它將AsyncHttpClient對(duì)象和各種含不同參數(shù)的get和post方法封裝在一起. 這樣實(shí)現(xiàn)的優(yōu)點(diǎn)是可以避免網(wǎng)絡(luò)請(qǐng)求處理時(shí)AsyncHttpClient對(duì)象的反復(fù)創(chuàng)建.

Web端的分頁(yè)處理技術(shù)應(yīng)用到Android移動(dòng)端上,首先要對(duì)前臺(tái)用于顯示圖文信息的ListView或GridView設(shè)置滾動(dòng)監(jiān)聽事件, 當(dāng)用戶滑動(dòng)到已加載的最后一條信息時(shí), 將當(dāng)前顯示頁(yè)號(hào)和每頁(yè)顯示總行數(shù)傳遞到后臺(tái)Servlet, 通過(guò)DAO方法訪問(wèn)數(shù)據(jù)庫(kù)加載指定數(shù)量的圖文內(nèi)容. 監(jiān)聽滾動(dòng)事件的核心代碼如圖7所示.

圖7 前臺(tái)ListView或GridView的滾動(dòng)事件的監(jiān)聽

而訪問(wèn)數(shù)據(jù)庫(kù)加載更多圖文信息是通過(guò)SQL語(yǔ)句查詢來(lái)實(shí)現(xiàn)的, 由于實(shí)現(xiàn)的效果是分頁(yè)顯示, SQL語(yǔ)句在書寫時(shí), 要傳入當(dāng)前行號(hào)和指定獲取的行數(shù)等參數(shù), 具體代碼如圖8所示.

圖8 后臺(tái)SQL語(yǔ)句查詢實(shí)現(xiàn)的PageBean數(shù)據(jù)獲取代碼

6 結(jié)語(yǔ)

為了提高Android端圖文信息的加載速度, 本文是從三個(gè)方面考慮的: 一是從信息本身特點(diǎn)出發(fā); 二是從網(wǎng)絡(luò)請(qǐng)求處理方式上考慮; 三是從數(shù)據(jù)庫(kù)訪問(wèn)方式上出發(fā). Android開源圖像視圖smart-Image-View和開源框架android-async-http的設(shè)計(jì)是廣大Android編程愛(ài)好者不斷修改創(chuàng)新的成果, 而分頁(yè)顯示技術(shù)則是在借鑒Web端分頁(yè)處理數(shù)據(jù)的基礎(chǔ)上應(yīng)用到Android移動(dòng)端的. 這三種方法結(jié)合使用到加載圖文信息上可以為其他App端項(xiàng)目開發(fā)提供參考價(jià)值.

1 任中方,張華,閆明松,陳世福.MVC模式研究的綜述.計(jì)算機(jī)應(yīng)用研究,2004,21(10):1–4,8

2 高靜,段會(huì)川.JSON數(shù)據(jù)傳輸效率研究.計(jì)算機(jī)工程與設(shè)計(jì), 2011,32(7):2267–2270.

3 Zhao Z, Song JD, Haihong E. Research and design for mobile application development on Android platform. The Journal of New Industrialization, 2013, 3(6): 78–89.

4 孟遠(yuǎn).Android網(wǎng)絡(luò)通信框架Volley的解析和比較.軟件,2014,(12):66–68.

5 Smith J. Android Smart Image View. http://loopj.com/ android- smart-image-view/.

6 譚東,楊德剛.Android網(wǎng)絡(luò)負(fù)載請(qǐng)求優(yōu)化方案設(shè)計(jì).中國(guó)新通信,2015,(2):107–108.

7 Smith J. Android Asynchronous HttpClient. http://loopj.com/ android-async-http/.

8 盧成均. ASP．NET中數(shù)據(jù)列表分頁(yè)方法研究.計(jì)算機(jī)系統(tǒng)應(yīng)用,2006,15(11):83–86.

9 王正玉,李斌.基于DAO模式的Hibernate框架在Java Web開發(fā)中的應(yīng)用.微型機(jī)與應(yīng)用,2015,(11):14–17.

10 歐陽(yáng)宏基,解爭(zhēng)龍,黃素萍,丁要軍.一種基于DAO設(shè)計(jì)模式與Hibernate框架的數(shù)據(jù)持久化層模型.微計(jì)算機(jī)應(yīng)用,2009,30(3):36–40.

Research and Implementation of Rapid Loading Picture and Text Information Based on Android

WANG Jie, WEI Zhen-Gang
(College of Information Science and Engineering, Ocean University of China, Qingdao 266100, China)

This paper proposes the issue that we should speed up the loading rate of image and text information on the Android mobile terminal, and meanwhile make users convenient to fast access to relevant information by browsing interface. On the basis of the relevant technology, this paper combines the Android image open source view with smart-Image-View, Network request framework, android-async-http and paging display technology. After using a large number of textual and graphic data to do the experiment, the result shows that the combination use of the three methods made it success to improve the loading rate of image and text information.

image and text information; loading rate; image open source view; network request framework; paging display

2016-03-18;收到修改稿時(shí)間:2016-04-24

10.15888/j.cnki.csa.005466