Android中ListView非同步載入圖片錯位、重複、閃爍問題分析及解決方案

作者：shineflowers 字體：[增加減小] 類型：轉載時間：2015-08-20 我要評論

在Android所有系統自帶的控制項當中，ListView這個控制項算是用法比較複雜的了，關鍵是用法複雜也就算了，它還經常會出現一些稀奇古怪的問題，讓人非常頭疼，下面通過本篇文章給大家分享Android中ListView非同步載入圖片錯位、重複、閃爍問題分析及解決方案，需要朋友可以參考

Android ListView非同步載入圖片錯位、重複、閃爍分析以及解決方案，具體問題分析以及解決方案請看下文。

我們在使用ListView非同步載入圖片的時候，在快速滑動或者網路不好的情況下，會出現圖片錯位、重複、閃爍等問題，其實這些問題總結起來就是一個問題，我們需要對這些問題進行ListView的優化。

比如ListView上有100個Item，一屏只顯示10個Item，我們知道getView()中convertView是用來複用View對象的，因為一個Item的對應一個View對象，而ImageView控制項就是View對象通過findViewById()獲得的，而我們在復用View對象時，同時這個ImageView對象也被複用了。比如第11個Item的View復用了第1個Item View對象，那麼ImageView就同時被複用了，所以當圖片沒下載出來，這個ImageView（第11個Item）顯示的數據就是復用（第1個Item）的數據。

1：Item圖片顯示重複

這個顯示重複是指當前行Item顯示了之前某行Item的圖片。

比如ListView滑動到第2行會非同步載入某個圖片，但是載入很慢，載入過程中ListView已經滑動到了第14行，且滑動過程中該圖片載入結束。第2行已不在屏幕內，根據上面介紹的緩存原理，第2行的View對象可能被第14行復用，這樣我們看到的就是第14行顯示了本該屬於第2行的圖片，造成顯示重複。

2. Item圖片顯示錯亂

這個顯示錯亂是指某行Item顯示了不屬於該行Item的圖片。

跟上面的原因一樣。

3. Item圖片顯示閃爍

上面介紹的另外一種情況，如果第14行圖片又很快載入結束，所以我們看到第14行先顯示了復用的第2行的圖片，立馬又顯示了自己的圖片進行覆蓋造成閃爍錯亂。

解決方案：

通過上面的分析我們知道了出現錯亂的原因是非同步載入及對象被複用造成的，如果每次getView能給對象一個標識，在非同步載入完成時比較標識與當前行Item的標識是否一致，一致則顯示，否則不做處理即可。

原理：首先給ImageView設置一個Tag，這個Tag中設置的是圖片的url，然後在載入的時候取得這個url和要載入那position中的url對比，如果不相同就載入，相同就是復用以前的就不載入了。

Android在ListView顯示圖片（重複錯亂閃爍問題）

1、原因分析

ListView item緩存機制：

為了使得性能更優，ListView會緩存行item(某行對應的View)。

ListView通過adapter的getView函數獲得每行的item。

滑動過程中

a. 如果某行item已經滑出屏幕，若該item不在緩存內，則put進緩存，否則更新緩存；

b. 獲取滑入屏幕的行item之前會先判斷緩存中是否有可用的item，如果有，做為convertView參數傳遞給adapter的getView。

這樣，如下的getView寫法就可以充分利用緩存大大提升ListView的性能。即便上萬個行item，最多inflate的次數為n，

n為一屏最多顯示ListView 行item的個數。

@Overridepublic 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圖片顯示重複

這個顯示重複是指當前行item顯示了之前某行item的圖片。

比如ListView滑動到第2行會非同步載入某個圖片，但是載入很慢，載入過程中listView已經滑動到了第14行，且滑動過程中該圖片載入結束，

第2行已不在屏幕內，根據上面介紹的緩存原理，第2行的view可能被第14行復用，這樣我們看到的就是第14行顯示了本該屬於第2行的圖片，

造成顯示重複。

b. 行item圖片顯示錯亂

這個顯示錯亂是指某行item顯示了不屬於該行item的圖片。

比如ListView滑動到第2行會非同步載入某個圖片，但是載入很慢，載入過程中listView已經滑動到了第14行，第2行已不在屏幕內，根據上面介紹的緩存原理，第2行的view可能被第14行復用，第14行顯示了第2行的View，這時之前的圖片載入結束，就會顯示在第14行，造成錯亂。

c. 行item圖片顯示閃爍

上面b的情況，第14行圖片又很快載入結束，所以我們看到第14行先顯示了第2行的圖片，立馬又顯示了自己的圖片進行覆蓋造成閃爍錯亂。

2、解決方法

通過上面的分析我們知道了出現錯亂的原因是非同步載入及對象被複用造成的，如果每次getView能給對象一個標識，在非同步載入完成時比較標識與當前行item的標識是否一致，一致則顯示，否則不做處理即可。

andbase中的實現代碼：

/** * 顯示這個圖片,解決了列表問題. * 列表問題：滑動過程中，getView的imageView會重複利用，導致圖片會串位 * @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 ; } //設置下載項 final AbImageDownloadItem item = new AbImageDownloadItem(); //設置顯示的大小 item.width = width; item.height = height; //設置為縮放 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); //設置標記 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) { //未設置載入中的圖片，並且設置了隱藏的View if (loadingView != null && imageUrl.equals(imageView.getTag())){ loadingView.setVisibility(View.INVISIBLE); imageView.setVisibility(View.VISIBLE); } //要判斷這個imageView的url有變化，如果沒有變化才set， //有變化就取消，解決列表的重複利用View的問題 if(bitmap!=null&& imageUrl.equals(imageView.getTag())){ if (D) Log.d(TAG, "圖片下載，設置:" +imageUrl); imageView.setImageBitmap(bitmap); } else { if (errorImage != null && imageUrl.equals(imageView.getTag())){ imageView.setImageDrawable(errorImage); } } } }); if (D) Log.d(TAG, "圖片下載，執行:" +url); mAbImageDownloadPool.execute(item); } else { if (loadingView != null ){ loadingView.setVisibility(View.INVISIBLE); imageView.setVisibility(View.VISIBLE); } imageView.setImageBitmap(item.bitmap); } }

以上內容就是Android中ListView非同步載入圖片錯位、重複、閃爍問題分析及解決方案，希望對大家今後的工作和學習有所幫助。