Picasso Images not loading in a GridView

Question

I am having issues with Picasso, I have a custom adapter loading images by the following:

Picasso.with(this.ctx).load(contact.getPhotoURI()).placeholder(R.drawable.contact_no_picture).into(img);

This is loaded into an ImageView which is placed inside a GridView.

The result is the following:

As you can see the images are half loaded and in some cases, not loaded at all.

Am I missing something?

Answer 1

When using Picasso with item renderers in a list / grid, I ended up using the ListeningTarget interface the lib provides:

Create a custom class that extends ImageView and implements ListeningTarget.

public class PicassoImageView extends ImageView implements ListeningTarget
{...}

In the overridden onBitmapLoaded method call this.setImageBitmap(bmp); where bmp is the parameter Picasso passes as the loaded image's bitmap:

@Override
public void onBitmapLoaded(Bitmap bmp, LoadedFrom loadedFrom)
{
    Log.d("Picasso", "Image loaded");
    this.setImageBitmap(bmp);
}

Use this class for the img instance in your layout.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" ...>

    [...]
    <com.your.packagename.PicassoImageView
        android:id="@+id/renderer_icon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" ... />
    [...]
</RelativeLayout>

And initialize it like:

PicassoImageView img = (PicassoImageView) findViewById(R.id.renderer_icon);

Change your call to Picasso to:

Picasso.with(this.ctx).load(contact.getPhotoURI())
    .placeholder(R.drawable.contact_no_picture)
    .into((ListeningTarget)img);

Of course it's not necessary to have the ImageView implement the ListeningTarget, but I found it easier than searching for the right view every time a bitmap is loaded by Picasso.