Android中ListView異步加載圖片錯位、重復(fù)、閃爍問題分析及解決方案
Android ListView異步加載圖片錯位、重復(fù)、閃爍分析以及解決方案,具體問題分析以及解決方案請看下文。
我們在使用ListView異步加載圖片的時候,在快速滑動或者網(wǎng)絡(luò)不好的情況下,會出現(xiàn)圖片錯位、重復(fù)、閃爍等問題,其實這些問題總結(jié)起來就是一個問題,我們需要對這些問題進行ListView的優(yōu)化。
比如ListView上有100個Item,一屏只顯示10個Item,我們知道getView()中convertView是用來復(fù)用View對象的,因為一個Item的對應(yīng)一個View對象,而ImageView控件就是View對象通過findViewById()獲得的,而我們在復(fù)用View對象時,同時這個ImageView對象也被復(fù)用了。比如第11個Item的View復(fù)用了第1個Item View對象,那么ImageView就同時被復(fù)用了,所以當(dāng)圖片沒下載出來,這個ImageView(第11個Item)顯示的數(shù)據(jù)就是復(fù)用(第1個Item)的數(shù)據(jù)。
1:Item圖片顯示重復(fù)
這個顯示重復(fù)是指當(dāng)前行Item顯示了之前某行Item的圖片。
比如ListView滑動到第2行會異步加載某個圖片,但是加載很慢,加載過程中ListView已經(jīng)滑動到了第14行,且滑動過程中該圖片加載結(jié)束。第2行已不在屏幕內(nèi),根據(jù)上面介紹的緩存原理,第2行的View對象可能被第14行復(fù)用,這樣我們看到的就是第14行顯示了本該屬于第2行的圖片,造成顯示重復(fù)。
2. Item圖片顯示錯亂
這個顯示錯亂是指某行Item顯示了不屬于該行Item的圖片。
跟上面的原因一樣。
3. Item圖片顯示閃爍
上面介紹的另外一種情況,如果第14行圖片又很快加載結(jié)束,所以我們看到第14行先顯示了復(fù)用的第2行的圖片,立馬又顯示了自己的圖片進行覆蓋造成閃爍錯亂。
解決方案:
通過上面的分析我們知道了出現(xiàn)錯亂的原因是異步加載及對象被復(fù)用造成的,如果每次getView能給對象一個標(biāo)識,在異步加載完成時比較標(biāo)識與當(dāng)前行Item的標(biāo)識是否一致,一致則顯示,否則不做處理即可。
原理:首先給ImageView設(shè)置一個Tag,這個Tag中設(shè)置的是圖片的url,然后在加載的時候取得這個url和要加載那position中的url對比,如果不相同就加載,相同就是復(fù)用以前的就不加載了。
Android在ListView顯示圖片(重復(fù)錯亂閃爍問題)
1、原因分析
ListView item緩存機制:
為了使得性能更優(yōu),ListView會緩存行item(某行對應(yīng)的View)。
ListView通過adapter的getView函數(shù)獲得每行的item。
滑動過程中
a. 如果某行item已經(jīng)滑出屏幕,若該item不在緩存內(nèi),則put進緩存,否則更新緩存;
b. 獲取滑入屏幕的行item之前會先判斷緩存中是否有可用的item,如果有,做為convertView參數(shù)傳遞給adapter的getView。
這樣,如下的getView寫法就可以充分利用緩存大大提升ListView的性能。即便上萬個行item,最多inflate的次數(shù)為n,
n為一屏最多顯示ListView 行item的個數(shù)。
@Override public View getView ( int position , View convertView , ViewGroup parent ) { ViewHolder holder ; if ( convertView == null ) { convertView = inflater . inflate ( R . layout . list_item , null ) ; holder = new ViewHolder ( ) ; …… convertView . setTag ( holder ) ; } else { holder = ( ViewHolder ) convertView . getTag ( ) ; } }
這樣提升了性能,但同時也會造成另外一些問題:
a. 行item圖片顯示重復(fù)
這個顯示重復(fù)是指當(dāng)前行item顯示了之前某行item的圖片。
比如ListView滑動到第2行會異步加載某個圖片,但是加載很慢,加載過程中l(wèi)istView已經(jīng)滑動到了第14行,且滑動過程中該圖片加載結(jié)束,
第2行已不在屏幕內(nèi),根據(jù)上面介紹的緩存原理,第2行的view可能被第14行復(fù)用,這樣我們看到的就是第14行顯示了本該屬于第2行的圖片,
造成顯示重復(fù)。
b. 行item圖片顯示錯亂
這個顯示錯亂是指某行item顯示了不屬于該行item的圖片。
比如ListView滑動到第2行會異步加載某個圖片,但是加載很慢,加載過程中l(wèi)istView已經(jīng)滑動到了第14行,第2行已不在屏幕內(nèi),根據(jù)上面介紹的緩存原理,第2行的view可能被第14行復(fù)用,第14行顯示了第2行的View,這時之前的圖片加載結(jié)束,就會顯示在第14行,造成錯亂。
c. 行item圖片顯示閃爍
上面b的情況,第14行圖片又很快加載結(jié)束,所以我們看到第14行先顯示了第2行的圖片,立馬又顯示了自己的圖片進行覆蓋造成閃爍錯亂。
2、解決方法
通過上面的分析我們知道了出現(xiàn)錯亂的原因是異步加載及對象被復(fù)用造成的,如果每次getView能給對象一個標(biāo)識,在異步加載完成時比較標(biāo)識與當(dāng)前行item的標(biāo)識是否一致,一致則顯示,否則不做處理即可。
andbase中的實現(xiàn)代碼:
/** * 顯示這個圖片,解決了列表問題. * 列表問題:滑動過程中,getView的imageView會重復(fù)利用,導(dǎo)致圖片會串位 * @param imageView 顯得的View * @param url the url * @return */ public void display( final ImageView imageView,String url) { if (AbStrUtil.isEmpty(url)){ if (noImage != null ){ if (loadingView != null ){ loadingView.setVisibility(View.INVISIBLE); imageView.setVisibility(View.VISIBLE); } imageView.setImageDrawable(noImage); } return ; } //設(shè)置下載項 final AbImageDownloadItem item = new AbImageDownloadItem(); //設(shè)置顯示的大小 item.width = width; item.height = height; //設(shè)置為縮放 item.type = type; item.imageUrl = url; final String cacheKey = AbImageCache .getCacheKey(item.imageUrl, item.width, item.height, item.type); item.bitmap = AbImageCache.getBitmapFromCache(cacheKey); //if(D) Log.d(TAG, "緩存中獲取的"+cacheKey+":"+item.bitmap); //設(shè)置標(biāo)記 imageView.setTag(url); if (item.bitmap == null ){ //先顯示加載中 if (loadingView!= null ){ loadingView.setVisibility(View.VISIBLE); imageView.setVisibility(View.INVISIBLE); } else if (loadingImage != null ){ imageView.setImageDrawable(loadingImage); } //下載完成后更新界面 item.setListener( new AbImageDownloadListener() { @Override public void update(Bitmap bitmap, String imageUrl) { //未設(shè)置加載中的圖片,并且設(shè)置了隱藏的View if (loadingView != null && imageUrl.equals(imageView.getTag())){ loadingView.setVisibility(View.INVISIBLE); imageView.setVisibility(View.VISIBLE); } //要判斷這個imageView的url有變化,如果沒有變化才set, //有變化就取消,解決列表的重復(fù)利用View的問題 if(bitmap!=null&& imageUrl.equals(imageView.getTag())){ if (D) Log.d(TAG, "圖片下載,設(shè)置:" +imageUrl); imageView.setImageBitmap(bitmap); } else { if (errorImage != null && imageUrl.equals(imageView.getTag())){ imageView.setImageDrawable(errorImage); } } } }); if (D) Log.d(TAG, "圖片下載,執(zhí)行:" +url); mAbImageDownloadPool.execute(item); } else { if (loadingView != null ){ loadingView.setVisibility(View.INVISIBLE); imageView.setVisibility(View.VISIBLE); } imageView.setImageBitmap(item.bitmap); } }
以上內(nèi)容就是Android中ListView異步加載圖片錯位、重復(fù)、閃爍問題分析及解決方案,希望對大家今后的工作和學(xué)習(xí)有所幫助。
- Android中Glide加載庫的圖片緩存配置究極指南
- android異步加載圖片并緩存到本地實現(xiàn)方法
- Android加載大分辨率圖片到手機內(nèi)存中的實例方法
- Android關(guān)于Glide的使用(高斯模糊、加載監(jiān)聽、圓角圖片)
- Android使用控件ImageView加載圖片的方法
- Android圖片加載利器之Picasso基本用法
- Android實現(xiàn)加載廣告圖片和倒計時的開屏布局
- Android 加載GIF圖最佳實踐方案
- android中Glide實現(xiàn)加載圖片保存至本地并加載回調(diào)監(jiān)聽
- 使用Thumbnails實現(xiàn)圖片指定大小壓縮
相關(guān)文章
Android ListView列表優(yōu)化的方法詳解
列表 ListView 是應(yīng)用中最為常見的組件,而列表往往也會承載很多元素,這時就需要對其進行優(yōu)化。本文介紹了 Flutter ListView 的4個優(yōu)化要點,非常實用,需要的可以參考一下2022-05-05Android讀取本地json文件的方法(解決顯示亂碼問題)
這篇文章主要介紹了Android讀取本地json文件的方法,結(jié)合實例形式對比分析了解決顯示亂碼問題的方法,需要的朋友可以參考下2016-06-06Android實現(xiàn)創(chuàng)建或升級數(shù)據(jù)庫時執(zhí)行語句
這篇文章主要介紹了Android實現(xiàn)創(chuàng)建或升級數(shù)據(jù)庫時執(zhí)行語句,是比較實用的功能,需要的朋友可以參考下2014-08-08Android實現(xiàn)移動小球和CircularReveal頁面切換動畫實例代碼
這篇文章主要給大家介紹了關(guān)于利用Android如何實現(xiàn)移動的小球和CircularReveal頁面切換動畫的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對各位Android開發(fā)者們具有一定的參考學(xué)習(xí)價值,需要的朋友們下面來一起看看吧。2017-09-09Android點亮屏幕或屏幕解鎖和鎖定以及其他相關(guān)權(quán)限實現(xiàn)代碼
本文將帶你實現(xiàn)Android屏幕解鎖和鎖定;Android屏幕常亮/點亮以及其他相關(guān)權(quán)限,感興趣的朋友可以參考下,希望本文對你有所幫助2013-01-01Android拍照保存在系統(tǒng)相冊不顯示的問題解決方法
我們保存相冊到Android手機的時候,然后去打開系統(tǒng)圖庫找不到我們想要的那張圖片,那是因為我們插入的圖片還沒有更新的緣故,下面與大家分享下此問題的解決方法2013-06-06android開發(fā)仿ios的UIScrollView實例代碼
下面小編就為大家分享一篇android開發(fā)仿ios的UIScrollView實例代碼,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-01-01