在listView中加载异步映像

时间:2012-10-17 11:56:57

标签: android listview asynchronous

我希望在列表视图中加载数据后从服务器加载图像。 我知道这个问题存在很多主题,但我还没有找到解决方案......

所以这是我的代码:

//asyncTackClass for loadingpictures
public class LoadImagesThread extends AsyncTask<Bundle, Void, Bitmap> {
    private ImageView view;
    private Bitmap bm;
    private Context context;
    private final WeakReference<ImageView> imageViewReference;

    private final String BUNDLE_URL = "url";
    private final String BUNDLE_NAME = "name";
    private final String BUNDLE_BM = "bm";

    public LoadImagesThread(Context context, ImageView view) {
        this.context=context;
        imageViewReference = new WeakReference<ImageView>(view);
    }

    @Override
    protected Bitmap doInBackground(Bundle... b) {

        Bitmap bm =null;
        if (StorageHelper.getBitmap(b[0].getString(BUNDLE_NAME)) != null) { // Check the sdcard
            bm = StorageHelper.getBitmap(b[0].getString(BUNDLE_NAME));
            Log.w("LoadImagesThread", "Get image from sdcard : "+b[0].getString(BUNDLE_NAME));
        } else { // Check the server
            bm = ServiceHelper.getBitmapFromURL(b[0].getString(BUNDLE_URL));
            StorageHelper.saveBitmap(bm, b[0].getString(BUNDLE_NAME)); // Save image on sdcard   
            Log.w("LoadImagesThread", "Get image from server : "+b[0].getString(BUNDLE_NAME));
        }

        return bm;
    }

    @Override
    protected void onPostExecute(final Bitmap bm) {
        super.onPostExecute(bm);        
        if (bm != null){ //if bitmap exists...
            view = imageViewReference.get();
            // Fade out
            Animation fadeOutAnimation = AnimationUtils.loadAnimation(context, R.anim.fadeoutimage);
            fadeOutAnimation.setAnimationListener(new AnimationListener() {

            public void onAnimationStart(Animation animation) {

            }

            public void onAnimationRepeat(Animation animation) {

            }

            public void onAnimationEnd(Animation animation) {
                // Fade in
                view.setImageBitmap(bm);
                Animation fadeInAnimation = AnimationUtils.loadAnimation(context, R.anim.fadeinimage);
                view.startAnimation(fadeInAnimation);
            }
        });

            // Launch the fadeout
            view.startAnimation(fadeOutAnimation);


        }else{ //if not picture, display the default ressource
            view.setImageResource(R.drawable.productcarre);
        }

    }

}

该代码用于在ImageView中显示位图

这是适配器:

public class ListViewShoplistStoresAdapter extends BaseAdapter {

private ArrayList<Shop> shopList;
private Activity activity;

private HashMap<Integer, ImageView> views;
private final String BUNDLE_URL = "url";
private final String BUNDLE_NAME = "name";
private final String BUNDLE_POS = "pos";
private final String BUNDLE_ID = "id";


public ListViewShoplistStoresAdapter(Activity activity, ArrayList<Shop> shopList) {
    super();
    this.activity = activity;
    this.shopList = shopList;
    this.views = new HashMap<Integer, ImageView>();
}

public int getCount() {
    return shopList.size();
}

public Object getItem(int position) {
    return shopList.get(position);
}

public long getItemId(int position) {
    return shopList.get(position).getId();
}

private class ViewHolder {
    public TextView store;
    public TextView name;
    public ImageView ImageStore;
}

public View getView(int position, View convertView, ViewGroup parent) {
    ViewHolder view;
    LayoutInflater inflator = activity.getLayoutInflater();

    if(convertView == null) {
        view = new ViewHolder();
        convertView = inflator.inflate(R.layout.listviewshops, null);

        view.store = (TextView) convertView.findViewById(R.id.store);
        view.name = (TextView) convertView.findViewById(R.id.name);
        view.ImageStore = (ImageView) convertView.findViewById(R.id.imgstore);

        convertView.setTag(view);
    }else {
        view = (ViewHolder) convertView.getTag();
    }

    Typeface regular=Typeface.createFromAsset(activity.getAssets(), "fonts/RobotoRegular.ttf");
    view.store.setTypeface(regular);

    Typeface light=Typeface.createFromAsset(activity.getAssets(), "fonts/RobotoLight.ttf");
    view.store.setTypeface(light);
    Brand brand = StorageHelper.getBrand(activity, shopList.get(position).getBrandId());
    if (brand == null) {
        Log.e("SetShopInAdapter","Brand null");
        Toast.makeText(activity, "Impossible d'afficher la liste de magasins", Toast.LENGTH_LONG).show();
    } else {
        view.store.setText(brand.getName());
        view.name.setText(shopList.get(position).getName());
        view.ImageStore.setImageResource(R.drawable.productcarre);
    }

    Bundle b = new Bundle();

    //url of the pict
    b.putString(BUNDLE_URL, ServiceHelper.getImageUrl("brand", brand.getName()));

    // name of image
    b.putString(BUNDLE_NAME, ServiceHelper.getCleanImageName(brand.getName()));

    //position in the listView
    b.putInt(BUNDLE_POS, position);

    //id of the current object
    b.putInt(BUNDLE_ID, brand.getId());

    //put info in the map in order to display in the onPostExecute
    if(views.get(position)==null){
        views.put(position, view.ImageStore);
        // launch thread
        new LoadImagesThread(activity.getApplicationContext(), view.ImageStore).execute(b);
    }

    return convertView;

}

}

所以,当我使用GridView时,没有任何问题,但是当我使用ListView时,图像只在第一项中被更改!

示例: 我想显示“汽车”,“房子”和“苹果”商品的产品图片。 代码将启动线程,所有图像(汽车然后房子,最后苹果)将显示在第一项(汽车项目)... 房子和苹果虽然没有图像!!

你知道我应该怎么做吗?

由于

4 个答案:

答案 0 :(得分:8)

你应该参考这个博客。太棒了。

http://android-developers.blogspot.in/2010/07/multithreading-for-performance.html

此链接也提供了一个演示应用程序。下载并尝试在您的应用中实现它。

答案 1 :(得分:2)

按照此链接从ListView中的服务器加载图像。

http://android-er.blogspot.in/2010/07/load-listview-in-background-asynctask.html

答案 2 :(得分:1)

这里有很多关于这个... 像这样的异步加载称为“延迟加载”

https://github.com/thest1/LazyList

使用列表

完全实现此类流程

一般来说,为了加载图像,我建议:

https://github.com/nostra13/Android-Universal-Image-Loader

答案 3 :(得分:0)

您可以使用排球来改善列表视图的效果。 看一下这个简单的例子:Android Custom ListView with Image and Text using Volley