Images loaded using Picasso gets removed at scrolling and keeps reloading

Question

I have a list of images that I retrieve from Firebase Storage using Picasso. The images load perfectly. But whenever I scroll, the loaded images get removed and reload when I scroll back which is really annoying for the eye of the user. How can I solve it such that every image loads only once and the loaded images stay as is even if the user scrolls.

this is my ListView in xml:

<ListView
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:id="@+id/lv"
  android:isScrollContainer="false"
  android:focusable="true"
  android:layout_weight="1"
  android:layout_marginTop="3dp"
  android:scrollingCache="true"
  />

This is the ImageView inside listitem:

<ImageView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:id="@+id/itemImage"
        android:background="@color/white"
        android:scaleType="fitCenter"
        android:layout_centerVertical="true"
        android:layout_weight="0"
        android:layout_marginTop="5dp"
        android:layout_marginBottom="5dp"
        android:padding="5dp"
        android:src="@drawable/white_filling"
        >
        </ImageView>

And this is my CustomAdapter:

public class Firebase_CustomAdapter extends BaseAdapter {
public static Context c;
ArrayList<Firebase_Holder> spacecrafts;

public Firebase_CustomAdapter(Context c, ArrayList<Firebase_Holder> spacecrafts) {
    this.c = c;
    this.spacecrafts = spacecrafts;
}

@Override
public int getCount() {
    return spacecrafts.size();
}
@Override
public Object getItem(int position) {
    return spacecrafts.get(position);
}
@Override
public long getItemId(int position) {
    return position;
}
@Override
public View getView(final int position, View convertView, ViewGroup parent) {

    if(convertView==null)
    {
        convertView= LayoutInflater.from(c).inflate(R.layout.list_item_books,parent,false);

        ViewHolder viewHolder = new ViewHolder();
        viewHolder.itemImage = (MyImageView) convertView.findViewById(R.id.itemImage);
    }

    final MyImageView itemImage= (MyImageView) convertView.findViewById(R.id.itemImage);

    final Firebase_Holder s= (Firebase_Holder) this.getItem(position);


            StorageReference mStorage = FirebaseStorage.getInstance().getReference();
            final StorageReference Adv_mStorge = mStorage.child("Items_pictures").child(s.getname().toLowerCase() + ".jpg");

                Adv_mStorge.getDownloadUrl().addOnSuccessListener(new OnSuccessListener<Uri>() {
                    @Override
                    public void onSuccess(Uri uri) {

                        Picasso.with(c).load(uri)
                                .into(itemImage);

                    }
                });

    return convertView;
}


public class ViewHolder {
    MyImageView itemImage;
}

}

Answer 1

I solved it, the problem was that the listener that I was putting to get the URL. I solved it by providing Picasso with a direct URL