Resize image to full width and variable height with Picasso

Question

I have a listView with an adapter that contains ImageView of variable size (width and height). I need resize the pictures load with Picasso to the max width of layout and a variable height given by the aspect ratio of the picture.

I have checked this question: Resize image to full width and fixed height with Picasso

The fit() works but I haven't found nothing to keep the aspect ratio of the picture.

This code partially works if I fixed the height in the layout of the adapter:

Picasso.with(this.context).load(message_pic_url) .placeholder(R.drawable.profile_wall_picture) .fit().centerInside() .into(holder.message_picture); 

But it generates blank spaces between the pictures of the listView because the pictures may be that not have that height.

Thanks in advance.

Answer 1

As of Picasso 2.4.0, this operation is now directly supported. Simply add a .resize() request with one of the dimensions as 0. For example, to have a variable width, your call would become:

Picasso.with(this.context)        .load(message_pic_url)        .placeholder(R.drawable.profile_wall_picture)        .resize(0, holder.message_picture.getHeight()),        .into(holder.message_picture); 

Note that this call uses .getHeight() and therefore assumes the message_picture has already been measured. If that isn't the case, such as when you have inflated a new view in a ListAdapter, you can delay this call until after measurement by adding an OnGlobalLayoutListener to the view:

holder.message_picture.getViewTreeObserver()       .addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {             // Wait until layout to call Picasso             @Override             public void onGlobalLayout() {                 // Ensure we call this only once                 imageView.getViewTreeObserver()                          .removeOnGlobalLayoutListener(this);                   Picasso.with(this.context)                        .load(message_pic_url)                        .placeholder(R.drawable.profile_wall_picture)                        .resize(0, holder.message_picture.getHeight())                        .into(holder.message_picture);             }         });