解决ListView异步加载网络图片的各种问题(一)

MainActivity如下:

package com.example.testlistview;import java.util.ArrayList;import android.os.Bundle;import android.app.Activity;import android.view.Menu;import android.widget.ListView;//解决的问题://1 ListView异步加载网络图片//2 ListView滑动时,图片错位public class MainActivity extends Activity {    private ListView listView;    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initView();    }    @Override    public boolean onCreateOptionsMenu(Menu menu) {        getMenuInflater().inflate(R.menu.activity_main, menu);        return true;    }        public void initView(){    listView=(ListView) findViewById(R.id.listView);    ArrayList<ListViewItem> arrayList=new ArrayList<ListViewItem>();    ListViewItem item1=new ListViewItem("xxxx", "http://images.csdn.net/20121018/zazhi-68-78-1018.jpg");arrayList.add(item1);ListViewItem item2=new ListViewItem("xxxx", "http://info-database.csdn.net/Upload/2012-10-08/zazhi-210-90-1008.jpg");arrayList.add(item2);ListViewItem item3=new ListViewItem("xxxx", "http://images.csdn.net/20121119/20111211223655841.jpg");arrayList.add(item3);ListViewItem item4=new ListViewItem("xxxx", "http://images.csdn.net/20121119/20120619174604972.jpg");arrayList.add(item4);ListViewItem item5=new ListViewItem("xxxx", "http://csdnimg.cn/www/images/pic_foot_report110.png");arrayList.add(item5);ListViewItem item6=new ListViewItem("xxxx", "http://csdnimg.cn/www/images/pic_foot_report.png");arrayList.add(item6);ListViewItem item7=new ListViewItem("xxxx", "http://csdnimg.cn/www/images/pic_foot_BNIA.png");arrayList.add(item7);ListViewItem item8=new ListViewItem("xxxx", "http://csdnimg.cn/www/images/pic_foot_gongshang.png");arrayList.add(item8);ListViewItem item9=new ListViewItem("xxxx", "http://images.csdn.net/20120803/logo-qixing02.jpg");arrayList.add(item9);ListViewItem item10=new ListViewItem("xxxx", "http://images.csdn.net/20120726/quanjing-logo-shouye.jpg");arrayList.add(item10);ListViewItem item11=new ListViewItem("xxxx", "http://images.csdn.net/20120726/nhn-logo-shouye.jpg");arrayList.add(item11);ListViewItem item12=new ListViewItem("xxxx", "http://images.csdn.net/20120510/shanghai-jiaoda-logo.jpg");arrayList.add(item12);ListViewItem item13=new ListViewItem("xxxx", "http://images.csdn.net/20120312/bigman2.gif");arrayList.add(item13);ListViewItem item14=new ListViewItem("xxxx", "http://images.csdn.net/20120216/csdn2.gif");arrayList.add(item14);ListViewItem item15=new ListViewItem("xxxx", "http://images.csdn.net/20121109/win8_100x74.jpg");arrayList.add(item15);ListViewItem item16=new ListViewItem("xxxx", "http://images.csdn.net/20120816/cf-20120816.jpg");arrayList.add(item16);ListViewItem item17=new ListViewItem("xxxx", "http://images.csdn.net/20120704/bi05.jpg");arrayList.add(item17);ListViewItem item18=new ListViewItem("xxxx", "http://images.csdn.net/20120816/amd-20120816.jpg");arrayList.add(item18);   MyListViewAdapter adapter=new MyListViewAdapter(arrayList, MainActivity.this,listView);          listView.setAdapter(adapter);    }}

ListViewItem的Bean如下:

package com.example.testlistview;public class ListViewItem {String content;String imageURL;public ListViewItem(String content, String imageURL) {super();this.content = content;this.imageURL = imageURL;}public String getContent() {return content;}public void setContent(String content) {this.content = content;}public String getImageURL() {return imageURL;}public void setImageURL(String imageURL) {this.imageURL = imageURL;}}

自定义BaseAdapter如下:

package com.example.testlistview;import java.util.ArrayList;import java.util.HashMap;import android.content.Context;import android.graphics.drawable.Drawable;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.ImageView;import android.widget.ListView;import android.widget.TextView;import com.example.loadimages.AsycPicLoader;import com.example.loadimages.AsycPicLoader.ImageCallback;public class MyListViewAdapter extends BaseAdapter{      private ArrayList<ListViewItem> mArrayList;      private Context mContext;      private AsycPicLoader asycPicLoader;      private ListView listView;      private HashMap<Integer, View> hashMap;       public MyListViewAdapter(ArrayList<ListViewItem> mArrayList,Context mContext,ListView listView ) {  super();  this.mArrayList = mArrayList;  this.mContext = mContext;  this.listView=listView;      asycPicLoader=new AsycPicLoader();      hashMap=new HashMap<Integer, View>();  }public int getCount() {if (mArrayList==null) {return 0;} else {return mArrayList.size();}}public Object getItem(int position) {if (mArrayList==null) {return null;} else {            return mArrayList.get(position);}}public long getItemId(int position) {return position;}public View getView(int position, View convertView, ViewGroup parent) {//从HashMap中取出此position对应的convertViewconvertView=hashMap.get(position);ViewHolder holder=null;if (convertView==null) {holder=new ViewHolder();convertView=LayoutInflater.from(this.mContext).inflate(R.layout.listviewitem, null, false);holder.textView=(TextView) convertView.findViewById(R.id.textView);    holder.imageView=(ImageView) convertView.findViewById(R.id.imageview);    convertView.setTag(holder);} else {            holder=(ViewHolder) convertView.getTag();}//设置ListView的每个itemif (this.mArrayList!=null) {ListViewItem listViewItem=this.mArrayList.get(position);if (holder.textView!=null) {holder.textView.setText(listViewItem.getContent());}if (holder.imageView!=null) {try {this.loadImage(listViewItem.getImageURL(),holder.imageView);} catch (Exception e) {e.printStackTrace();}}}    //设置完成后的convertView放在HashMap中    if (!hashMap.containsKey(position)) {    hashMap.put(position, convertView);}return convertView;}public void loadImage(String imgageURL, final ImageView imageView) {asycPicLoader.loadImages(imgageURL, new ImageCallback() {public void showLoadedImage(Drawable imageDrawable) {if (imageDrawable!=null&&imageDrawable.getIntrinsicWidth()>0) {imageView.setImageDrawable(imageDrawable);}}});}private class ViewHolder{ImageView imageView;TextView textView;}      }

异步加载网络图片,方法如下:

package com.example.loadimages;import java.io.IOException;import java.lang.ref.SoftReference;import java.net.URL;import java.util.HashMap;import java.util.Map;import android.graphics.drawable.Drawable;import android.os.Handler;import android.os.Message;import android.util.Log;public class AsycPicLoader {   private Map<String, SoftReference<Drawable>> softReferenceMap;   //构造方法   public AsycPicLoader(){   softReferenceMap=new HashMap<String, SoftReference<Drawable>>();   }   //加载图片   public Drawable loadImages(final String imageURL,final ImageCallback imageCallback){   //如果图片在SoftReference中,则将其取出   if (softReferenceMap.containsKey(imageURL)) {  SoftReference<Drawable> softReference=softReferenceMap.get(imageURL);  if (softReference!=null) {  Log.i("xx", "从缓存中取出来"); return softReference.get();} }   //如果图片不在SoftReference中,则从网络获取图片.   final Handler handler=new Handler(){   @Overridepublic void handleMessage(Message msg) {super.handleMessage(msg);Drawable drawable=(Drawable) msg.obj;imageCallback.showLoadedImage(drawable);}   };   new Thread(){  public void run() {  super.run();  Drawable drawable=LoadImageFromUrl(imageURL);  softReferenceMap.put(imageURL, new SoftReference<Drawable>(drawable));  Message message=new Message();  message.obj=drawable;  handler.sendMessage(message);   };   }.start();   return null;   }     //从网络获取图片   private Drawable LoadImageFromUrl(String url){   try {return Drawable.createFromStream((new URL(url)).openStream(), "src");}  catch (IOException e) {e.printStackTrace();}        return null;   }      //定义一个回调接口.用于图片下载完成后,在ImageView中显示图片   public interface ImageCallback {   public void showLoadedImage(Drawable imageDrawable);}}

main.xml如下:

<RelativeLayout     xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent" >      <ListView         android:id="@+id/listView"        android:layout_width="fill_parent"        android:layout_height="wrap_content"     >            </ListView></RelativeLayout>

listviewitem.xml如下:

<?xml version="1.0" encoding="utf-8"?><LinearLayout    xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="50dip"    android:orientation="horizontal" >       <ImageView         android:id="@+id/imageview"        android:layout_width="50dip"         android:layout_height="50dip"          />        <TextView         android:id="@+id/textView"        android:layout_width="50dip"        android:layout_height="50dip"        android:text="haha"        android:layout_marginLeft="150dip"     />  </LinearLayout>

1楼easyer2012昨天 10:40

哪些代码是解决：“//2 ListView滑动时,图片错位 ”问题？