How to load images from url into viewpager2?

问题

I'm using ViewPager2 in my app to show some images it worked well when I used images from drawable but when i try to load images from links it shows error. I'm new to this so please help me how to load them from url.

It throws error at the adapter class as items.size(); refers to null.

Item Class

public class ImageSlider1_Item {

    private String imageURL;

    public ImageSlider1_Item(String imageURL){
        this.imageURL = imageURL;
    }

    public String getImageURL (){
        return imageURL;
    }
}

Adapter Class

public class ImageSlider1_Adapter extends RecyclerView.Adapter<ImageSlider1_Adapter.ImageSlider1_ViewHolder>{

    private List<ImageSlider1_Item> items;
    private ViewPager2 viewPager2;

   public ImageSlider1_Adapter(List<ImageSlider1_Item> items, ViewPager2 viewPager2) {
        this.items = items;
        this.viewPager2 = viewPager2;
    }

    @NonNull
    @Override
    public ImageSlider1_ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        return new ImageSlider1_ViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.image_slider_layout, parent, false));
    }

    @Override
    public void onBindViewHolder(@NonNull ImageSlider1_ViewHolder holder, int position) {

        holder.setImageView(items.get(position));
    }

    @Override
    public int getItemCount() {
        return items.size();
    }

    class ImageSlider1_ViewHolder extends RecyclerView.ViewHolder{

        private RoundedImageView imageView;

        ImageSlider1_ViewHolder(@NonNull View itemView) {
            super(itemView);
            imageView = itemView.findViewById(R.id.imageSlide);
        }

        void setImageView(ImageSlider1_Item slider1Item){
            Glide.with(itemView.getContext())
                    .load(slider1Item.getImageURL())
                    .into(imageView);
        }
    }

}

Main Activity

FirebaseFirestore firebaseFirestore = FirebaseFirestore.getInstance();
         firebaseFirestore.collection("Image Sliders").document("Whats New").get()
                 .addOnSuccessListener(documentSnapshot -> {
                     slider1_items = new ArrayList<>();
                     slider1_items.add(new ImageSlider1_Item(documentSnapshot.getString("Image1")));
                     slider1_items.add(new ImageSlider1_Item(documentSnapshot.getString("Image2")));
                     slider1_items.add(new ImageSlider1_Item(documentSnapshot.getString("Image3")));
                     slider1_items.add(new ImageSlider1_Item(documentSnapshot.getString("Image4")));
                     slider1_items.add(new ImageSlider1_Item(documentSnapshot.getString("Image5")));
                 });
       ViewPager2 viewPager2 = view.findViewById(R.id.imageSlider_1);
       viewPager2.setAdapter(new ImageSlider1_Adapter(slider1_items, viewPager2));

       viewPager2.setClipToPadding(false);
       viewPager2.setClipChildren(false);
       viewPager2.setOffscreenPageLimit(3);
       viewPager2.getChildAt(0).setOverScrollMode(RecyclerView.OVER_SCROLL_NEVER);
       CompositePageTransformer compositePageTransformer = new CompositePageTransformer();
       compositePageTransformer.addTransformer(new MarginPageTransformer(40));
       viewPager2.setPageTransformer(compositePageTransformer);

回答1:

1st change your adapter like this :

public class ImageSlider1_Adapter extends RecyclerView.Adapter<ImageSlider1_Adapter.ImageSlider1_ViewHolder>{

private List<ImageSlider1_Item> items;
private Context context;

public ImageSlider1_Adapter(List<ImageSlider1_Item> items) {
    this.items = items;
}

public void setItems(List<ImageSlider1_Item> items) {
    this.items = items;
}


@NonNull
@Override
public ImageSlider1_ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
    context = parent.getContext();
    return new ImageSlider1_ViewHolder(LayoutInflater.from(context).inflate(R.layout.image_slider_layout, parent, false));
}

@Override
public void onBindViewHolder(@NonNull ImageSlider1_ViewHolder holder, int position) {

    holder.setImageView(items.get(position));
}

@Override
public int getItemCount() {
    return items.size();
}

class ImageSlider1_ViewHolder extends RecyclerView.ViewHolder{

    private RoundedImageView imageView;

    ImageSlider1_ViewHolder(@NonNull View itemView) {
        super(itemView);
        imageView = itemView.findViewById(R.id.imageSlide);
    }

    void setImageView(ImageSlider1_Item slider1Item){
       //custom settings for fast loading image
       RequestOptions options = new RequestOptions()
            .diskCacheStrategy(DiskCacheStrategy.AUTOMATIC)
            .centerCrop()
            .priority(Priority.HIGH)
            .format(DecodeFormat.PREFER_RGB_565);

       Glide.with(context)
            .applyDefaultRequestOptions(options)
            .load(slider1Item.getImageURL())
            .thumbnail(0.4f)
            .into(imageView);
    }
}

}

next in your activity

//1st initialize list & adapter
 private List<ImageSlider1_Item> slider1_items = new ArrayList<>();
 private ImageSlider1_Adapter adapter;


 //2sd initialize views
  ViewPager2 viewPager2 = view.findViewById(R.id.imageSlider_1);
   viewPager2.setClipToPadding(false);
   viewPager2.setClipChildren(false);
   viewPager2.setOffscreenPageLimit(3);
   viewPager2.getChildAt(0).setOverScrollMode(RecyclerView.OVER_SCROLL_NEVER);
   CompositePageTransformer compositePageTransformer = new CompositePageTransformer();
   compositePageTransformer.addTransformer(new MarginPageTransformer(40));
   viewPager2.setPageTransformer(compositePageTransformer);

   //3d remove ViewPager2 from adapter constructor -  no need for that
   //and initialize new adapter without viewPager2

   adapter = new ImageSlider1_Adapter(slider1_items);

   //next set adapter to ViewPager2
   viewPager2.setAdapter(adapter);


   FirebaseFirestore firebaseFirestore = FirebaseFirestore.getInstance();
     firebaseFirestore.collection("Image Sliders").document("Whats New").get()
             .addOnSuccessListener(documentSnapshot -> {
                 slider1_items.clear();
                 slider1_items.add(new ImageSlider1_Item(documentSnapshot.getString("Image1")));
                 slider1_items.add(new ImageSlider1_Item(documentSnapshot.getString("Image2")));
                 slider1_items.add(new ImageSlider1_Item(documentSnapshot.getString("Image3")));
                 slider1_items.add(new ImageSlider1_Item(documentSnapshot.getString("Image4")));
                 slider1_items.add(new ImageSlider1_Item(documentSnapshot.getString("Image5")));
                 //next setList to adapter
                 adapter.setItems(slider1_items);
                 adapter.notifyDataSetChanged();

             });

来源：https://stackoverflow.com/questions/61487212/how-to-load-images-from-url-into-viewpager2