How to dynamically add and remove pages in Android ViewPager2?

Question

Here is what I was trying to do. addNewQRCard() is onclick event fired by a button to add new images to viewpager. I have to always set the adapter to new items. But why in my case onStart() doesn't do that job. Please give me the best practice that I should use to add and delete views dynamically from viewPager2.

public class AddPage extends AppCompatActivity {

    private ViewPager2 viewPager2;
    private ArrayList<ModelItem> items;
    private AdapterSlider adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_add_qrcode);

        viewPager2 = findViewById(R.id.viewPagerImageSlider);

        items = new ArrayList<>();
        items.add(new ModelItem(R.drawable.image1));


        adapter = new AdapterSlider(items,viewPager2);

        viewPager2.setAdapter(adapter);

        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));
        compositePageTransformer.addTransformer(new ViewPager2.PageTransformer() {
            @Override
            public void transformPage(@NonNull View page, float position) {
                float r = 1 - Math.abs(position);
                page.setScaleY(0.85f + r * 0.15f);
            }
        });

        viewPager2.setPageTransformer(compositePageTransformer);
    }

    @Override
    protected void onStart() {
        super.onStart();
        adapter = new AdapterQRSlider(sliderItems,viewPager2);

        viewPager2.setAdapter(adapter);
    }

    public void addNewQRCard(View view) {   //this is the button which i used to add new childs
        items.add(new ModelSlider(R.drawable.image2));

        adapter = new AdapterSlider(items,viewPager2);

        viewPager2.setAdapter(adapter);
    }
}

Adapter class

public class AdapterSliderextends RecyclerView.Adapter<AdapterSlider.ViewHolder>{

    private ArrayList<ModelSlider> items;
    private ViewPager2 viewPager2;

    public AdapterSlider(ArrayList<ModelSlider> items, ViewPager2 viewPager2) {
        this.items= items;
        this.viewPager2 = viewPager2;
    }

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

    @Override
    public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
        holder.setImage(items.get(position));
    }

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

    class ViewHolder extends RecyclerView.ViewHolder{

        private ImageView imageView;

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

        void setImage(ModelSlider items){
            imageView.setImageResource(sliderItem.getImage());
        }
    }
}

Model Class

public class ModelSlider {

    private int image;

    public ModelSlider(int image){
        this.image = image;
    }

    public int getImage() {
        return image;
    }
}

Answer 1

You can notify adapter when you adding new items just like the way you do it with RecyclerView. Something like this

public void addNewQRCard(View view) {
    items.add(new ModelSlider(R.drawable.image2));
    // instead of of resetting adapter to ViewPager,
    // just notify its adapter of item inserted
    adapter.notifyItemInserted(items.size - 1)
}