Rudy_TM
Rudy_TM

Reputation: 1430

Loading images in a gridview with async task, not loading correctly

I'm trying to load thumnails in a gridview async, because other way it take too long to show!

When I do it the normal way, it shows the images fine. (Code and image)

Utils

public static Bitmap getThumbnail(Context context, Bitmap bitmap, int columns){
        WindowManager wm = (WindowManager)context.getSystemService(Context.WINDOW_SERVICE);
        Display display = wm.getDefaultDisplay();
        Point size = new Point();
        display.getSize(size);

        int scale = size.x / columns;
        Bitmap bit = ThumbnailUtils.extractThumbnail(bitmap, scale, scale);
        return bit;
    }

Adapter

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View view;
        if(convertView == null){
            LayoutInflater inflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            view = inflater.inflate(R.layout.adapter_item, null);
        }
        else{
            view = convertView;
        }
        ImageView image = (ImageView)view.findViewById(R.id.img_item);
        image.setImageBitmap(Utilities.getThumbnail(context, BitmapFactory.decodeFile(((Item) this.collection.get(position)).getSrc()), 5));
        return view;
    }

Grid with images loaded

And this is the result with the asyncTask

AsyncTask

public class ImageGridHandler extends AsyncTask<String, Void, Bitmap>{
    private final WeakReference<ImageView> imageViewReference;
    private Context context;

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

    @Override
    protected Bitmap doInBackground(String... params) {
        return PixzelleUtilities.getThumbnail(this.context, BitmapFactory.decodeFile(params[0]) ,5);
    }

    @Override
    protected void onPostExecute(Bitmap result) {
        final ImageView imageView = imageViewReference.get();
        imageView.setImageBitmap(result);
    }
}

Adapter

@Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View view;
        if(convertView == null){
            LayoutInflater inflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            view = inflater.inflate(R.layout.adapter_item, null);
        }
        else{
            view = convertView;
        }
        ImageView image = (ImageView)view.findViewById(R.id.img_item);
        image.setImageBitmap(null);
        ImageGridHandler handler = new ImageGridHandler(context, image);
        handler.execute(((Item)this.collection.get(position)).getSrc());
        return view;
    }

The images are little black rectangles.

The images don't load correctly

The uris are correct becaus I can touch the images and open in popup window!

Am I missing something?

Upvotes: 4

Views: 6726

Answers (1)

Grant Amos
Grant Amos

Reputation: 2256

You need to notify your adapter that the layout has changed so the view can be re-measured. This is expensive, however, and will cause a re-layout every time an image loads. You should avoid this by having a fixed size for each of the gridview tiles. Currently, my guess is that your R.layout.adapter_item.xml has wrap_content for it's height. Change this to a fixed value and it should solve your problem.

If you want to take a performance hit, notify your adapter that a change has occured with notifyDataSetChanged.

http://developer.android.com/reference/android/widget/BaseAdapter.html#notifyDataSetChanged()

Upvotes: 1

Related Questions