Work With Picasso and recycler view to show a list of images

Question

I have a list of items(6) and I am using Picasso and OkHttp libraries to download and Show images in my recycler view.

I have 6 item in my recycler view and 3 of them (1,2,4 )have an image on the server and items 3,5 and 6 have no image. but in my recycler view downloaded images for item 1,2,4 will show for items 3,5 and 6 too! I don't know where is the problem. This is my Code that from Adapter that download and load images with Picasso:

   public class BaseListAdapter extends RecyclerView.Adapter<BaseListAdapter.ViewHolder> {
  private List<PList> menuItems;
  private Context mContext;
  private ActivitySingleGroup activitySingleGroup;


  //Bottom Sheets Views Declaration
  private TextView txtSelectedProduct;
  private TextView txtPRemark;
  private TextView txtQty;
  private EditText edtUserQty;
  private Button btnBuy;
  private Button btnDiscard;
  private ViewPager mPager;
  private CircleIndicator indicator;

  public BaseListAdapter(List<PList> menuItems, Context mContext) {
    this.menuItems = menuItems;
    this.mContext = mContext;
    this.activitySingleGroup = (ActivitySingleGroup) mContext;
  }

  public static class ViewHolder extends RecyclerView.ViewHolder {

    TextView txtName;
    TextView txtPrice;
    ImageView imgDefault;
    LinearLayout parentLayout;
    CoordinatorLayout coordinatorLayout;

    public ViewHolder(View v) {
      super(v);

      txtName = (TextView) v.findViewById(R.id.txtName);
      txtPrice = (TextView) v.findViewById(R.id.txtPrice);
      imgDefault = (ImageView) v.findViewById(R.id.img_defaultImage);
      parentLayout = (LinearLayout) v.findViewById(R.id.parentLayout);
      coordinatorLayout = (CoordinatorLayout) v.findViewById(R.id.coordinatorLayout);

    }
  }

  @Override
  public BaseListAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

    // Create a new View
    final View v = LayoutInflater.from(activitySingleGroup).inflate(R.layout.activity_normal_group_recycler, parent, false);
    ViewHolder vh = new ViewHolder(v);
    return vh;
  }

  @Override
  public void onBindViewHolder(final ViewHolder holder, final int position) {


    //Download and Load Default Image from server into imgDefault ImageView
    Picasso picasso;
    OkHttpClient client = null;
    String url = "https://bartarinapp-irdeveloper.rhcloud.com/api/images/download/";

    //Handel situations that default image variables will be null
    if (menuItems.get(position).getPDefaultImage() != null &&
      menuItems.get(position).getPDefaultImage().getDefault() != null) {

      if ((menuItems.get(position).getPDefaultImage().getDefault()) &&
        (menuItems.get(position).getPDefaultImage().getIId() != null)) {

        url += menuItems.get(position).getPDefaultImage().getIId();

        client = ServerClass.downloadImage(
          menuItems.get(position).getPDefaultImage().getIId(),
          holder.imgDefault,
          activitySingleGroup);

        picasso = new Picasso.Builder(mContext)
          .downloader(new OkHttp3Downloader(client))
          .listener(new Picasso.Listener() {
            @Override
            public void onImageLoadFailed(Picasso picasso, Uri uri, Exception exception) {
              //Here your log
              Log.i("I_ERROR", "Error is: " + exception.toString());
            }
          })
          .build();

      } else {
        url = null;
        picasso = new Picasso.Builder(mContext)
          .listener(new Picasso.Listener() {
            @Override
            public void onImageLoadFailed(Picasso picasso, Uri uri, Exception exception) {
              //Here your log
              Log.i("I_ERROR", "Error is: " + exception.toString());
            }
          })
          .build();

      }
    } else {
      url = null;
      picasso = new Picasso.Builder(mContext)
        .listener(new Picasso.Listener() {
          @Override
          public void onImageLoadFailed(Picasso picasso, Uri uri, Exception exception) {
            //Here your log
            Log.i("I_ERROR", "Error is: " + exception.toString());
          }
        })
        .build();
    }


    picasso.cancelRequest(holder.imgDefault);
    if (url != null && url.length() > 0) {

      //put here picaso image load code
      picasso.load(url)
        .placeholder(R.drawable.loading_01)
        .error(R.drawable.loading_02)
        .into(holder.imgDefault);

    } else {
      holder.imgDefault.setImageDrawable(null);
    }

    holder.txtName.setText(menuItems.get(position).getPName());
    holder.txtPrice.setText(String.valueOf(menuItems.get(position).getPPrice()));
    holder.parentLayout.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View view) {

        prepareBottomSheet(view, position, holder.coordinatorLayout);
      }
    });
  }

  @Override
  public int getItemCount() {
    if (menuItems.size() > 0) {

      return menuItems.size();

    } else {
      return 0;
    }

  }

Thank you for your help.

Answer 1

Use Picasso.get()

        Picasso.get().load(mImageUrls.get(i))
            .error(R.drawable.loading_erro)
            .placeholder(R.drawable.loading)
            .into(viewHolder.imgItem, new Callback() {
                        @Override
                        public void onSuccess() {

                        }

                        @Override
                        public void onError(Exception e) {

                        }
                    });

Answer 2

There is little problem with such libraries i.e picaso and glide

But i'm using glide library and i too had this problem but it got solved by the following code please try this code...

the dependency

compile 'com.github.bumptech.glide:glide:4.0.0'

    Glide.with(context.getApplicationContext()).load(imageUrl).signature(new StringSignature(String.valueOf(System.currentTimeMillis()))).diskCacheStrategy(DiskCacheStrategy.SOURCE).into(imageView);

Answer 3

Just put following one line before load image in image view using Picasso

    Picasso.with(this.context).cancelRequest(holder.imageView);
    if(imgUrl!=null && imgUrl.trim().length()>0){
        //put here picaso image load code
    }else {
        holder.imageView.setImageResource(R.drawable.no_img);
    }