Search code examples
androidgridviewpicasso

Display multiple images at the same time using picasso into gridview in android


Please help me with this.I tried this code but it diplaying the images at different times.I need to display all images at the same time.thank you for your help

Picasso.with(getContext()).load(result.thumListUrl).fetch();
                Picasso
                        .with(getContext())
                        .load(result.thumListUrl)
                        .networkPolicy(NetworkPolicy.OFFLINE)
                        .fit()
                        .into(img, new Callback() {
                            @Override
                            public void onSuccess() {
                                Log.d("Picasso", "Image loaded from cache>>>" + result.thumListUrl);
                            }

                            @Override
                            public void onError() {
                                Log.d("Picasso", "Try again in ONLINE mode if load from cache is failed");
                                Picasso.with(getContext()).load(result.thumListUrl).fit().into(img, new Callback() {
                                    @Override
                                    public void onSuccess() {
                                        Log.d("Picasso", "Image loaded from web>>>" + result.thumListUrl);
                                    }

                                    @Override
                                    public void onError() {
                                        Log.d("Picasso", "Failed to load image online and offline, make sure you enabled INTERNET permission for your app and the url is correct>>>>>>>" + result.thumListUrl);
                                    }
                                });
                            }
                        });

Solution

  • Load images from URL and let it load when it fetches the data at different times, instead hide the imageview or cover it with place holder imageview on top of it untill all the images are loaded.

    In Fragment

     private int loadedImages = 0;
        private int numberOfImagesToBeLoaded = 2;
        ArrayList<ImageView> images = new ArrayList<>();
        addImageUsingPicasso(url1,img1);
        addImageUsingPicasso(url2,img2);
    
      public void addImageUsingPicasso(String url,ImageView img){
         images.add(img);
        private Target target = new Target() {
              @Override
              public void onBitmapLoaded(Bitmap bitmap, Picasso.LoadedFrom from) {
                   img.setImageBitmap(bitmap);
                   loadedImages++;
                   if(loadedImages == numberOfImagesToBeLoaded) { //<--- All images are loaded
                      showImages(); 
                   }
              }
    
              @Override
              public void onBitmapFailed(Drawable errorDrawable) {
                  loadedImages++;
              }
    
              @Override
              public void onPrepareLoad(Drawable placeHolderDrawable) {
              }
           }
         Picasso.with(getContext()).load(url).into(target);
       }
    
    
      private void showImages(){
         for(ImageView image : images){
             image.setVisibility(View.VISIBLE);
          }
       }