listview中getview异步加载网络图片

前言:本以为异步加载挺简单,因为网上代码多,但真想要做好,还真不那么简单,从看代码到弄懂再到自己写,实在是有太多的东西需要学了,用了两天的时间,终于弄出来了,因为用到回调函数,所以理解起来可能难度有点大,讲起来也不太好讲,我尽力讲的明白些,其实还是要多看代码,自己摸索摸索,动手写写就什么都理解了。这篇我们只讲怎样实现异步加载,对于滑动时停止加载的事下篇再讲。

实现效果:

1、异步加载图片,在加载图片时,先加载一个默认的图片,然后在后台加载图片,加载完成后显示出来;

2、当用户在滑动时,停止加载图片的线程,当停止滑动时,看哪几个ITEM在显示屏内,只加载这几个,其它线程保持阻止;(下篇再讲)

效果图:

刚开始加载时                          向下划动(新划出来的是空白块)           停划,加载完成

   

一、XML

1、main.xml

[html] view plaincopyprint?

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:orientation="vertical"
  4. android:layout_width="fill_parent"
  5. android:layout_height="fill_parent"
  6. >
  7. <ListView android:id="@+id/list"
  8. android:layout_width="fill_parent"
  9. android:layout_height="fill_parent" />
  10. </LinearLayout>
<?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"
    >
    <ListView android:id="@+id/list"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />
</LinearLayout>

2、列表子项XML(book_item_adapter.xml)

[html] view plaincopyprint?

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:layout_width="fill_parent"
  4. android:layout_height="70.0dip"
  5. android:background="@drawable/item"
  6. android:drawingCacheQuality="high"
  7. android:minHeight="70.0dip"
  8. android:orientation="horizontal" >
  9. <ImageView
  10. android:id="@+id/sItemIcon"
  11. android:layout_width="42.0dip"
  12. android:layout_height="54.0dip"
  13. android:layout_margin="10.0dip"
  14. android:background="@drawable/rc_item_bg"
  15. android:padding="2.0dip"
  16. android:scaleType="fitXY" />
  17. <TextView
  18. android:text="斗破苍穹"
  19. android:id="@+id/sItemTitle"
  20. android:layout_width="fill_parent"
  21. android:layout_height="30.0dip"
  22. android:layout_alignTop="@+id/sItemIcon"
  23. android:layout_toRightOf="@+id/sItemIcon"
  24. android:gravity="center_vertical"
  25. android:singleLine="true"
  26. android:textColor="#ffffff"
  27. android:textSize="18.0sp" />
  28. </RelativeLayout>
<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="70.0dip"
    android:background="@drawable/item"
    android:drawingCacheQuality="high"
    android:minHeight="70.0dip"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/sItemIcon"
        android:layout_width="42.0dip"
        android:layout_height="54.0dip"
        android:layout_margin="10.0dip"
        android:background="@drawable/rc_item_bg"
        android:padding="2.0dip"
        android:scaleType="fitXY" />

    <TextView
        android:text="斗破苍穹"
        android:id="@+id/sItemTitle"
        android:layout_width="fill_parent"
        android:layout_height="30.0dip"
        android:layout_alignTop="@+id/sItemIcon"
        android:layout_toRightOf="@+id/sItemIcon"
        android:gravity="center_vertical"
        android:singleLine="true"
        android:textColor="#ffffff"
        android:textSize="18.0sp" />
</RelativeLayout>

二、JAVA代码

1、主页面代码(AsyncListImage.java)

[java] view plaincopyprint?

  1. package cn.wangmeng.test;
  2. import java.util.ArrayList;
  3. import java.util.List;
  4. import android.app.Activity;
  5. import android.os.Bundle;
  6. import android.widget.ListView;
  7. public class AsyncListImage extends Activity {
  8. private ListView list;
  9. @Override
  10. public void onCreate(Bundle savedInstanceState) {
  11. super.onCreate(savedInstanceState);
  12. setContentView(R.layout.main);
  13. list=(ListView)findViewById(R.id.list);
  14. List<ImageAndText> dataArray=new ArrayList<ImageAndText>();
  15. for (int i = 0; i < 100; i++) {
  16. ImageAndText test=new ImageAndText("http://www.wangmeng.cn/images/logo.gif", "test");
  17. ImageAndText test1=new ImageAndText("http://www.pfwx.com/files/article/image/0/54/54s.jpg", "test1");
  18. ImageAndText test2=new ImageAndText("http://www.pfwx.com/files/article/image/0/4/4s.jpg","test2");
  19. ImageAndText test3=new ImageAndText("http://www.pfwx.com/files/article/image/9/9760/9760s.jpg","test3");
  20. ImageAndText test4=new ImageAndText("http://www.pfwx.com/files/article/image/3/3382/3382s.jpg","test4");
  21. ImageAndText test5=new ImageAndText("http://www.pfwx.com/files/article/image/3/3237/3237s.jpg","test5");
  22. dataArray.add(test);
  23. dataArray.add(test1);
  24. dataArray.add(test2);
  25. dataArray.add(test3);
  26. dataArray.add(test4);
  27. dataArray.add(test5);
  28. }
  29. ImageAndTextListAdapter adapter=new ImageAndTextListAdapter(this, dataArray, list);
  30. list.setAdapter(adapter);
  31. }
  32. }
package cn.wangmeng.test;

import java.util.ArrayList;
import java.util.List;

import android.app.Activity;
import android.os.Bundle;
import android.widget.ListView;

public class AsyncListImage extends Activity {
	private ListView list;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        list=(ListView)findViewById(R.id.list);
        List<ImageAndText> dataArray=new ArrayList<ImageAndText>();
        for (int i = 0; i < 100; i++) {
        	 ImageAndText test=new ImageAndText("http://www.wangmeng.cn/images/logo.gif", "test");
             ImageAndText test1=new ImageAndText("http://www.pfwx.com/files/article/image/0/54/54s.jpg", "test1");
             ImageAndText test2=new ImageAndText("http://www.pfwx.com/files/article/image/0/4/4s.jpg","test2");
             ImageAndText test3=new ImageAndText("http://www.pfwx.com/files/article/image/9/9760/9760s.jpg","test3");
             ImageAndText test4=new ImageAndText("http://www.pfwx.com/files/article/image/3/3382/3382s.jpg","test4");
             ImageAndText test5=new ImageAndText("http://www.pfwx.com/files/article/image/3/3237/3237s.jpg","test5");
             dataArray.add(test);
             dataArray.add(test1);
             dataArray.add(test2);
             dataArray.add(test3);
             dataArray.add(test4);
             dataArray.add(test5);	

		}

        ImageAndTextListAdapter adapter=new ImageAndTextListAdapter(this, dataArray, list);
        list.setAdapter(adapter);

    }
}

2、ImageAndText.java

[java] view plaincopyprint?

  1. package cn.wangmeng.test;
  2. public class ImageAndText {
  3. private String imageUrl;
  4. private String text;
  5. public ImageAndText(String imageUrl, String text) {
  6. this.imageUrl = imageUrl;
  7. this.text = text;
  8. }
  9. public String getImageUrl() {
  10. return imageUrl;
  11. }
  12. public String getText() {
  13. return text;
  14. }
  15. }
package cn.wangmeng.test;

public class ImageAndText {
	    private String imageUrl;
	    private String text;

	    public ImageAndText(String imageUrl, String text) {
	        this.imageUrl = imageUrl;
	        this.text = text;
	    }
	    public String getImageUrl() {
	        return imageUrl;
	    }
	    public String getText() {
	        return text;
	    }
}

上面两个代码一块讲 1、ImageAndText类是用来存储要与XML绑定的图片地址和名字地址的。

2、将所有的地址都放在一个List里面(dataArray),然后将其传入ImageAndTextListAdapter()函数中;可见这个ImageAndTextListAdapter()函数是根据传进去的dataArray生成对应的Adapter的

3、然后将ImageAndTextListAdapter()返回的Adapter与listView绑定

3、ImageAndTextListAdapter.java

这是重写于baseAdapter的类,由于重写于baseAdapter,所以有几个必须重写的函数,getCount()、getItem()、getItemId()、getView(),我们先把总体代码写出来,只讲一个getView()函数,其实函数就不讲了,先着重说下getView()函数在什么时候被系统调用:

getView()函数在什么时候被系统调用:

注意一点是android系统在显示列表时,并不是把所有代表都显示出来,让你随便划,划到哪是哪;而是根据当前的在划到的ITEM,调用当前ITEM的getView()来显示它。

全部代码:

[java] view plaincopyprint?

  1. package cn.wangmeng.test;
  2. import java.util.ArrayList;
  3. import java.util.List;
  4. import cn.wangmeng.test.AsyncImageLoader.ImageCallback;
  5. import android.app.Activity;
  6. import android.graphics.drawable.Drawable;
  7. import android.util.Log;
  8. import android.view.LayoutInflater;
  9. import android.view.View;
  10. import android.view.ViewGroup;
  11. import android.widget.ArrayAdapter;
  12. import android.widget.BaseAdapter;
  13. import android.widget.ImageView;
  14. import android.widget.ListView;
  15. import android.widget.TextView;
  16. public class ImageAndTextListAdapter extends BaseAdapter {
  17. private LayoutInflater inflater;
  18. private ListView listView;
  19. private AsyncImageLoader asyncImageLoader;
  20. private List<ImageAndText> dataArray=new ArrayList<ImageAndText>();
  21. public ImageAndTextListAdapter(Activity activity, List<ImageAndText> imageAndTexts, ListView listView) {
  22. this.listView = listView;
  23. asyncImageLoader = new AsyncImageLoader();
  24. inflater = activity.getLayoutInflater();
  25. dataArray=imageAndTexts;
  26. }
  27. @Override
  28. public int getCount() {
  29. // TODO Auto-generated method stub
  30. return dataArray.size();
  31. }
  32. @Override
  33. public Object getItem(int position) {
  34. // TODO Auto-generated method stub
  35. if(position >= getCount()){
  36. return null;
  37. }
  38. return dataArray.get(position);
  39. }
  40. @Override
  41. public long getItemId(int position) {
  42. // TODO Auto-generated method stub
  43. return position;
  44. }
  45. //不需要ViewHolder版,直接将ImageAndText与XML资源关联起来
  46. public View getView(int position, View convertView, ViewGroup parent) {
  47. if (convertView == null) {
  48. convertView = inflater.inflate(R.layout.book_item_adapter, null);
  49. }
  50. convertView.setTag(position);
  51. ImageAndText imageAndText = (ImageAndText) getItem(position);
  52. String imageUrl = imageAndText.getImageUrl();
  53. TextView textView =  (TextView) convertView.findViewById(R.id.sItemTitle);
  54. // 将XML视图项与用户输入的URL和文本在绑定
  55. textView.setText(imageAndText.getText());//加载TEXT
  56. ImageView iv = (ImageView) convertView.findViewById(R.id.sItemIcon);
  57. iv.setBackgroundResource(R.drawable.rc_item_bg);//在初始化时,先把背景图片设置成默认背景,
  58. //否则在下拉时会随机匹配背景,不美观
  59. asyncImageLoader.loadDrawable(position,imageUrl, new ImageCallback() {
  60. @Override
  61. public void onImageLoad(Integer pos, Drawable drawable) {
  62. View view = listView.findViewWithTag(pos);
  63. if(view != null){
  64. ImageView iv = (ImageView) view.findViewById(R.id.sItemIcon);
  65. iv.setBackgroundDrawable(drawable);
  66. }
  67. }
  68. //加载不成功的图片处理
  69. @Override
  70. public void onError(Integer pos) {
  71. View view = listView.findViewWithTag(pos);
  72. if(view != null){
  73. ImageView iv = (ImageView) view.findViewById(R.id.sItemIcon);
  74. iv.setBackgroundResource(R.drawable.rc_item_bg);
  75. }
  76. }
  77. });
  78. return convertView;
  79. }
  80. }
package cn.wangmeng.test;

import java.util.ArrayList;
import java.util.List;

import cn.wangmeng.test.AsyncImageLoader.ImageCallback;

import android.app.Activity;
import android.graphics.drawable.Drawable;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;

public class ImageAndTextListAdapter extends BaseAdapter {

		private LayoutInflater inflater;
	    private ListView listView;
	    private AsyncImageLoader asyncImageLoader;

	    private List<ImageAndText> dataArray=new ArrayList<ImageAndText>();

	    public ImageAndTextListAdapter(Activity activity, List<ImageAndText> imageAndTexts, ListView listView) {

	        this.listView = listView;
	        asyncImageLoader = new AsyncImageLoader();
	        inflater = activity.getLayoutInflater();
	        dataArray=imageAndTexts;
	    }

		@Override
		public int getCount() {
			// TODO Auto-generated method stub
			return dataArray.size();
		}
		@Override
		public Object getItem(int position) {
			// TODO Auto-generated method stub
			if(position >= getCount()){
				return null;
			}
			return dataArray.get(position);
		}
		@Override
		public long getItemId(int position) {
			// TODO Auto-generated method stub
			return position;
		}

	    //不需要ViewHolder版,直接将ImageAndText与XML资源关联起来
	    public View getView(int position, View convertView, ViewGroup parent) {
	    	if (convertView == null) {
	        	 convertView = inflater.inflate(R.layout.book_item_adapter, null);
	        }
	        convertView.setTag(position);

	        ImageAndText imageAndText = (ImageAndText) getItem(position);
	        String imageUrl = imageAndText.getImageUrl();

	        TextView textView =  (TextView) convertView.findViewById(R.id.sItemTitle);
	        // 将XML视图项与用户输入的URL和文本在绑定
	        textView.setText(imageAndText.getText());//加载TEXT
	        ImageView iv = (ImageView) convertView.findViewById(R.id.sItemIcon);
	        iv.setBackgroundResource(R.drawable.rc_item_bg);//在初始化时,先把背景图片设置成默认背景,
	        							//否则在下拉时会随机匹配背景,不美观

	        asyncImageLoader.loadDrawable(position,imageUrl, new ImageCallback() {
	        	@Override
	    		public void onImageLoad(Integer pos, Drawable drawable) {
	    			View view = listView.findViewWithTag(pos);
	    			if(view != null){
	    				ImageView iv = (ImageView) view.findViewById(R.id.sItemIcon);
	    				iv.setBackgroundDrawable(drawable);
	    			}
	    		}
	        	//加载不成功的图片处理
				@Override
				public void onError(Integer pos) {
					View view = listView.findViewWithTag(pos);
					if(view != null){
						ImageView iv = (ImageView) view.findViewById(R.id.sItemIcon);
						iv.setBackgroundResource(R.drawable.rc_item_bg);
					}
				}

	        });
	        return convertView;
	    }
}

我们着重看getView()函数 1、看这段:

[java] view plaincopyprint?

  1. if (convertView == null) {
  2. convertView = inflater.inflate(R.layout.book_item_adapter, null);
  3. }
  4. convertView.setTag(position);
  5. ImageAndText imageAndText = (ImageAndText) getItem(position);
  6. String imageUrl = imageAndText.getImageUrl();
  7. TextView textView =  (TextView) convertView.findViewById(R.id.sItemTitle);
  8. // 将XML视图项与用户输入的URL和文本在绑定
  9. textView.setText(imageAndText.getText());//加载TEXT
  10. ImageView iv = (ImageView) convertView.findViewById(R.id.sItemIcon);
  11. iv.setBackgroundResource(R.drawable.rc_item_bg);
if (convertView == null) {
	 convertView = inflater.inflate(R.layout.book_item_adapter, null);
}
convertView.setTag(position);

ImageAndText imageAndText = (ImageAndText) getItem(position);
String imageUrl = imageAndText.getImageUrl();

TextView textView =  (TextView) convertView.findViewById(R.id.sItemTitle);
// 将XML视图项与用户输入的URL和文本在绑定
textView.setText(imageAndText.getText());//加载TEXT
ImageView iv = (ImageView) convertView.findViewById(R.id.sItemIcon);
iv.setBackgroundResource(R.drawable.rc_item_bg);

这段代码没什么特别的就是将前面dataArray的信息与XML的元素项对应起来,并绑定,最关键的是下面这段,下面这个方法才是实现异步加载图片的关键:

[java] view plaincopyprint?

  1. asyncImageLoader.loadDrawable(position,imageUrl, new ImageCallback() {
  2. @Override
  3. public void onImageLoad(Integer pos, Drawable drawable) {
  4. View view = listView.findViewWithTag(pos);
  5. if(view != null){
  6. ImageView iv = (ImageView) view.findViewById(R.id.sItemIcon);
  7. iv.setBackgroundDrawable(drawable);
  8. }
  9. }
  10. //加载不成功的图片处理
  11. @Override
  12. public void onError(Integer pos) {
  13. View view = listView.findViewWithTag(pos);
  14. if(view != null){
  15. ImageView iv = (ImageView) view.findViewById(R.id.sItemIcon);
  16. iv.setBackgroundResource(R.drawable.rc_item_bg);
  17. }
  18. }
  19. });
asyncImageLoader.loadDrawable(position,imageUrl, new ImageCallback() {
	@Override
	public void onImageLoad(Integer pos, Drawable drawable) {
		View view = listView.findViewWithTag(pos);
		if(view != null){
			ImageView iv = (ImageView) view.findViewById(R.id.sItemIcon);
			iv.setBackgroundDrawable(drawable);
		}
	}
	//加载不成功的图片处理
	@Override
	public void onError(Integer pos) {
		View view = listView.findViewWithTag(pos);
		if(view != null){
			ImageView iv = (ImageView) view.findViewById(R.id.sItemIcon);
			iv.setBackgroundResource(R.drawable.rc_item_bg);
		}
	}

});

这段代码的奇特之处在于,利用AsyncImageLoader类的实例(asyncImageLoader),调用方法loadDrawable()方法,就实现了加载后图像的绑定;好神奇,仔细看他是怎么做到的。这里先注意的有两点: (1)、传进去的参数,当前项的位置(position),当前图片的URL(imageUrl),一个名称为ImageCallback()接口函数;

(2)、ImageCallback()接口函数里的两个被重写的函数onImageLoad()和onError()

3、AsyncImageLoader.java

从上面的讲解也应该能猜到这个类,主要的功能就是加载图片,然后成功后更新UI;

先看全部代码,然后再逐步讲

[java] view plaincopyprint?

  1. package cn.wangmeng.test;
  2. import java.io.IOException;
  3. import java.io.InputStream;
  4. import java.lang.ref.SoftReference;
  5. import java.net.URL;
  6. import java.util.HashMap;
  7. import android.graphics.drawable.Drawable;
  8. import android.os.Handler;
  9. public class AsyncImageLoader {
  10. final Handler handler = new Handler();
  11. private HashMap<String, SoftReference<Drawable>> imageCache;
  12. public AsyncImageLoader() {
  13. imageCache = new HashMap<String, SoftReference<Drawable>>();//图片缓存
  14. }
  15. // 回调函数
  16. public interface ImageCallback {
  17. public void onImageLoad(Integer t, Drawable drawable);
  18. public void onError(Integer t);
  19. }
  20. public Drawable loadDrawable(final Integer pos, final String imageUrl,
  21. final ImageCallback imageCallback) {
  22. new Thread() {
  23. @Override
  24. public void run() {
  25. LoadImg(pos, imageUrl, imageCallback);
  26. }
  27. }.start();
  28. return null;
  29. }// loadDrawable---end
  30. public void LoadImg(final Integer pos, final String imageUrl,
  31. final ImageCallback imageCallback) {
  32. // 首先判断是否在缓存中
  33. // 但有个问题是:ImageCache可能会越来越大,以至用户内存用光,所以要用SoftReference(弱引用)来实现
  34. if (imageCache.containsKey(imageUrl)) {
  35. SoftReference<Drawable> softReference = imageCache.get(imageUrl);
  36. final Drawable drawable = softReference.get();
  37. if (drawable != null) {
  38. handler.post(new Runnable() {
  39. @Override
  40. public void run() {
  41. imageCallback.onImageLoad(pos, drawable);
  42. }
  43. });
  44. return;
  45. }
  46. }
  47. // 尝试从URL中加载
  48. try {
  49. final Drawable drawable = loadImageFromUrl(imageUrl);
  50. if (drawable != null) {
  51. imageCache.put(imageUrl, new SoftReference<Drawable>(drawable));
  52. }
  53. handler.post(new Runnable() {
  54. @Override
  55. public void run() {
  56. imageCallback.onImageLoad(pos, drawable);
  57. }
  58. });
  59. } catch (IOException e) {
  60. handler.post(new Runnable() {
  61. @Override
  62. public void run() {
  63. imageCallback.onError(pos);
  64. }
  65. });
  66. e.printStackTrace();
  67. }
  68. }
  69. // 根据URL加载图片,如果出现错误throws IOException式的错误,以便在LoadImg中捕获,执行OnError()函数
  70. public static Drawable loadImageFromUrl(String url) throws IOException {
  71. URL m;
  72. InputStream i = null;
  73. m = new URL(url);
  74. i = (InputStream) m.getContent();
  75. Drawable d = Drawable.createFromStream(i, "src");
  76. return d;
  77. }
  78. }
package cn.wangmeng.test;

import java.io.IOException;
import java.io.InputStream;
import java.lang.ref.SoftReference;
import java.net.URL;
import java.util.HashMap;

import android.graphics.drawable.Drawable;
import android.os.Handler;

public class AsyncImageLoader {
	final Handler handler = new Handler();
	private HashMap<String, SoftReference<Drawable>> imageCache;
	public AsyncImageLoader() {
		imageCache = new HashMap<String, SoftReference<Drawable>>();//图片缓存
	}

	// 回调函数
	public interface ImageCallback {
		public void onImageLoad(Integer t, Drawable drawable);
		public void onError(Integer t);
	}

	public Drawable loadDrawable(final Integer pos, final String imageUrl,
			 final ImageCallback imageCallback) {
		new Thread() {
			@Override
			public void run() {

				LoadImg(pos, imageUrl, imageCallback);

			}
		}.start();
		return null;
	}// loadDrawable---end

	public void LoadImg(final Integer pos, final String imageUrl,
			final ImageCallback imageCallback) {
		// 首先判断是否在缓存中
		// 但有个问题是:ImageCache可能会越来越大,以至用户内存用光,所以要用SoftReference(弱引用)来实现
		if (imageCache.containsKey(imageUrl)) {
			SoftReference<Drawable> softReference = imageCache.get(imageUrl);
			final Drawable drawable = softReference.get();
			if (drawable != null) {
				handler.post(new Runnable() {
					@Override
					public void run() {
						imageCallback.onImageLoad(pos, drawable);
					}
				});
				return;
			}
		}
		// 尝试从URL中加载
		try {
			final Drawable drawable = loadImageFromUrl(imageUrl);
			if (drawable != null) {
				imageCache.put(imageUrl, new SoftReference<Drawable>(drawable));
			}
			handler.post(new Runnable() {
				@Override
				public void run() {
						imageCallback.onImageLoad(pos, drawable);
				}
			});
		} catch (IOException e) {
			handler.post(new Runnable() {
				@Override
				public void run() {
					imageCallback.onError(pos);
				}
			});
			e.printStackTrace();
		}

	}

	// 根据URL加载图片,如果出现错误throws IOException式的错误,以便在LoadImg中捕获,执行OnError()函数
	public static Drawable loadImageFromUrl(String url) throws IOException {
		URL m;
		InputStream i = null;
		m = new URL(url);
		i = (InputStream) m.getContent();
		Drawable d = Drawable.createFromStream(i, "src");
		return d;
	}

}

分别讲解 1、先看这段代码

[java] view plaincopyprint?

  1. // 回调函数
  2. public interface ImageCallback {
  3. public void onImageLoad(Integer t, Drawable drawable);
  4. public void onError(Integer t);
  5. }
  6. public Drawable loadDrawable(final Integer pos, final String imageUrl,
  7. final ImageCallback imageCallback) {
  8. new Thread() {
  9. @Override
  10. public void run() {
  11. LoadImg(pos, imageUrl, imageCallback);
  12. }
  13. }.start();
  14. return null;
  15. }// loadDrawable---end
	// 回调函数
	public interface ImageCallback {
		public void onImageLoad(Integer t, Drawable drawable);
		public void onError(Integer t);
	}

	public Drawable loadDrawable(final Integer pos, final String imageUrl,
			 final ImageCallback imageCallback) {
		new Thread() {
			@Override
			public void run() {

				LoadImg(pos, imageUrl, imageCallback);

			}
		}.start();
		return null;
	}// loadDrawable---end

(1)首先注意,刚才我们调用的loadDrawable()函数,里面初始化并运行了一个线程,而这个线程的里面只有一个函数LoadImg(),对于这个函数下面我们具体讲,它的主要功能就是加载图片,然后更新UI (2)上面也看出了ImageCallback是一个接口,而里面的两个函数onImageLoad()和onError()在这里是没有具体实现的,那在哪里实现呢,当然是我们上面的ImageAndTextListAdapter.java里面了,等下我们具体会再讲。

再往下看

[java] view plaincopyprint?

  1. // 根据URL加载图片,如果出现错误throws IOException式的错误,以便在LoadImg中捕获,执行OnError()函数
  2. public static Drawable loadImageFromUrl(String url) throws IOException {
  3. URL m;
  4. InputStream i = null;
  5. m = new URL(url);
  6. i = (InputStream) m.getContent();
  7. Drawable d = Drawable.createFromStream(i, "src");
  8. return d;
  9. }
  10. public void LoadImg(final Integer pos, final String imageUrl,
  11. final ImageCallback imageCallback) {
  12. // 首先判断是否在缓存中
  13. // 但有个问题是:ImageCache可能会越来越大,以至用户内存用光,所以要用SoftReference(弱引用)来实现
  14. if (imageCache.containsKey(imageUrl)) {
  15. SoftReference<Drawable> softReference = imageCache.get(imageUrl);
  16. final Drawable drawable = softReference.get();
  17. if (drawable != null) {
  18. handler.post(new Runnable() {
  19. @Override
  20. public void run() {
  21. imageCallback.onImageLoad(pos, drawable);
  22. }
  23. });
  24. return;
  25. }
  26. }
  27. // 尝试从URL中加载
  28. try {
  29. final Drawable drawable = loadImageFromUrl(imageUrl);
  30. if (drawable != null) {
  31. imageCache.put(imageUrl, new SoftReference<Drawable>(drawable));
  32. }
  33. handler.post(new Runnable() {
  34. @Override
  35. public void run() {
  36. imageCallback.onImageLoad(pos, drawable);
  37. }
  38. });
  39. } catch (IOException e) {
  40. handler.post(new Runnable() {
  41. @Override
  42. public void run() {
  43. imageCallback.onError(pos);
  44. }
  45. });
  46. e.printStackTrace();
  47. }
  48. }
	// 根据URL加载图片,如果出现错误throws IOException式的错误,以便在LoadImg中捕获,执行OnError()函数
		public static Drawable loadImageFromUrl(String url) throws IOException {
			URL m;
			InputStream i = null;
			m = new URL(url);
			i = (InputStream) m.getContent();
			Drawable d = Drawable.createFromStream(i, "src");
			return d;
		}

	public void LoadImg(final Integer pos, final String imageUrl,
			final ImageCallback imageCallback) {
		// 首先判断是否在缓存中
		// 但有个问题是:ImageCache可能会越来越大,以至用户内存用光,所以要用SoftReference(弱引用)来实现
		if (imageCache.containsKey(imageUrl)) {
			SoftReference<Drawable> softReference = imageCache.get(imageUrl);
			final Drawable drawable = softReference.get();
			if (drawable != null) {
				handler.post(new Runnable() {
					@Override
					public void run() {
						imageCallback.onImageLoad(pos, drawable);
					}
				});
				return;
			}
		}
		// 尝试从URL中加载
		try {
			final Drawable drawable = loadImageFromUrl(imageUrl);
			if (drawable != null) {
				imageCache.put(imageUrl, new SoftReference<Drawable>(drawable));
			}
			handler.post(new Runnable() {
				@Override
				public void run() {
						imageCallback.onImageLoad(pos, drawable);
				}
			});
		} catch (IOException e) {
			handler.post(new Runnable() {
				@Override
				public void run() {
					imageCallback.onError(pos);
				}
			});
			e.printStackTrace();
		}

	}

(1)、loadImageFromUrl()函数,就是根据URL到网上加载图片,然后返回图片流Drawable类型变量 (2)、对于LoadImg()我们再拆一下,先看如何在缓存中加载

[java] view plaincopyprint?

  1. if (imageCache.containsKey(imageUrl)) {
  2. SoftReference<Drawable> softReference = imageCache.get(imageUrl);
  3. final Drawable drawable = softReference.get();
  4. if (drawable != null) {
  5. handler.post(new Runnable() {
  6. @Override
  7. public void run() {
  8. imageCallback.onImageLoad(pos, drawable);
  9. }
  10. });
  11. return;
  12. }
  13. }
		if (imageCache.containsKey(imageUrl)) {
			SoftReference<Drawable> softReference = imageCache.get(imageUrl);
			final Drawable drawable = softReference.get();
			if (drawable != null) {
				handler.post(new Runnable() {
					@Override
					public void run() {
						imageCallback.onImageLoad(pos, drawable);
					}
				});
				return;
			}
		}

注意:

1、在这里就已经得到了图像

[java] view plaincopyprint?

  1. SoftReference<Drawable> softReference = imageCache.get(imageUrl);
  2. final Drawable drawable = softReference.get();
			SoftReference<Drawable> softReference = imageCache.get(imageUrl);
			final Drawable drawable = softReference.get();

2、得到图像之后就到了这段代码:

[java] view plaincopyprint?

  1. if (drawable != null) {
  2. handler.post(new Runnable() {
  3. @Override
  4. public void run() {
  5. imageCallback.onImageLoad(pos, drawable);
  6. }
  7. });
  8. return;
  9. }
			if (drawable != null) {
				handler.post(new Runnable() {
					@Override
					public void run() {
						imageCallback.onImageLoad(pos, drawable);
					}
				});
				return;
			}

当我们得到图像之后,调用imageCallback.onImageLoad(pos, drawable);来更新UI,由于我们再回来看看ImageAndTextListAdapter.java中的代码

[java] view plaincopyprint?

  1. asyncImageLoader.loadDrawable(position,imageUrl, new ImageCallback() {
  2. @Override
  3. public void onImageLoad(Integer pos, Drawable drawable) {
  4. View view = listView.findViewWithTag(pos);
  5. if(view != null){
  6. ImageView iv = (ImageView) view.findViewById(R.id.sItemIcon);
  7. iv.setBackgroundDrawable(drawable);
  8. }
  9. }
  10. });
asyncImageLoader.loadDrawable(position,imageUrl, new ImageCallback() {
	@Override
	public void onImageLoad(Integer pos, Drawable drawable) {
		View view = listView.findViewWithTag(pos);
		if(view != null){
			ImageView iv = (ImageView) view.findViewById(R.id.sItemIcon);
			iv.setBackgroundDrawable(drawable);
		}
	}

});

看到了吧,就是把得到的drawable与加载到UI中!!!!这就实现了回调

OK,就到这吧,OnError()的原理一样,只不过是对程序没有加载到图片时应该怎么处理,其实就是当没有加载到图片时就是默认图片代替。
下面给出源码:http://download.csdn.net/detail/harvic880925/6802241(不要分,仅供分享)

请大家尊重作者板权,转载请标明出处:http://blog.csdn.net/harvic880925/article/details/17766027 ,谢谢!

时间: 2024-12-28 11:27:30

listview中getview异步加载网络图片的相关文章

浅谈Android中的异步加载之ListView中图片的缓存及优化三

     隔了很久没写博客,现在必须快速脉动回来.今天我还是接着上一个多线程中的异步加载系列中的最后一个使用异步加载实现ListView中的图片缓存及其优化.具体来说这次是一个综合Demo.但是个人觉得里面还算有点价值的就是里面的图片的缓存的实现.因为老实说它确实能在实际的项目中得到很好的应用.主要学习来源于慕课网中的异步加载学习,来自徐宜生大神的灵感.本次也就是对大神所讲知识的一个总结及一些个人的感受吧. 这次是一个综合的Demo,主要里面涉及到的知识主要有:网络编程.异步加载.JSON解析.

Android之ListView异步加载网络图片(优化缓存机制)【转】

网上关于这个方面的文章也不少,基本的思路是线程+缓存来解决.下面提出一些优化: 1.采用线程池 2.内存缓存+文件缓存 3.内存缓存中网上很多是采用SoftReference来防止堆溢出,这儿严格限制只能使用最大JVM内存的1/4 4.对下载的图片进行按比例缩放,以减少内存的消耗 具体的代码里面说明.先放上内存缓存类的代码MemoryCache.java: public class MemoryCache { private static final String TAG = "MemoryCa

ListView与GridView异步加载图片

原理很简单,主要是用到了回调方法,下面是异步加载图片的类 <span style="font-size:16px;">package com.xxx.xxx; import java.io.InputStream; import java.lang.ref.SoftReference; import java.net.URL; import java.util.HashMap; import android.graphics.drawable.Drawable; impor

Android进阶:ListView性能优化异步加载图片 使滑动效果流畅

ListView 是一种可以显示一系列项目并能进行滚动显示的 View,每一行的Item可能包含复杂的结构,可能会从网络上获取icon等的一些图标信息,就现在的网络速度要想保持ListView运行的很好滚动流畅是做不到的 所以这里就需要把这些信息利用多线程实现异步加载 实现这样功能的类 [java] view plaincopy public class AsyncImageLoader { private HashMap<String, SoftReference<Drawable>&

iOS开发swift版异步加载网络图片(带缓存和缺省图片)

iOS开发之swift版异步加载网络图片 与SDWebImage异步加载网络图片的功能相似,只是代码比较简单,功能没有SD的完善与强大,支持缺省添加图片,支持本地缓存. 异步加载图片的核心代码如下:  func setZYHWebImage(url:NSString?, defaultImage:NSString?, isCache:Bool){         var ZYHImage:UIImage?         if url == nil {             return   

扩展于RCLabel的支持异步加载网络图片的富文本引擎的设计

扩展于RCLabel的支持异步加载网络图片的富文本引擎的设计 在iOS开发中,图文混排一直都是UI编程的一个核心点,也有许多优秀的第三方引擎,其中很有名的一套图文混排的框架叫做DTCoreText.但是在前些日的做的一个项目中,我并没有采用这套框架,原因有二,一是这套框架体积非常大,而项目的需求其实并不太高:二是要在这套框架中修改一些东西,难度也非常大,我最终采用的是一个叫做RCLabel的第三方控件,经过一些简单的优化和完善,达到了项目的要求. 先来介绍一下我项目中的图文混排的需求:首先我从服

ios开发多线程篇--异步加载网络图片

一.异步加载网络图片 1.ATS (1)简介 从iOS9.0开始,如果按照以前的方式写代码,在访问网络的时候 ,会报以下警告信息: App Transport Security has blocked a cleartext HTTP (http://) resource load since it is insecure. Temporary exceptions can be configured via your app's Info.plist file. 原因:iOS9.0引入了新特性

浅谈android中的异步加载一

1.为什么需要异步加载. 因为我们都知道在Android中的是单线程模型,不允许其他的子线程来更新UI,只允许UI线程(主线程更新UI),否则会多个线程都去更新UI会造成UI的一个混乱有些耗时的操纵(例如网络请求等),如果直接放到主线程中去请求的话则会造成主线程阻塞,而我们系统有规定的响应时间,当响应的时间超过了了阻塞的时间就会造成"Application No Response",也就是我们熟知的ANR错误解决上述问题的时候:我们一般使用的是线程或者线程池+Handler机制如果线程

iOS_第3方类库_EGOImageView异步加载网络图片

异步加载网络图片是很常见的需求 下载,导入,-fno-objc-arc 1.导入头文件 2.创建EGOImageView,并指定占位图,设置url即可 最终效果图:(后补) 附EGO原文件地址: