home top ad

How to Create Image Slider using ViewPager in android studio

Hello friends today we will learn about How to create image slider using ViewPager in android studio
We use Image Slider in many of our apps like we use it in photo gallery etc.Let's start with how to make Image Slider in Android.To create it, we have to follow some rules.

Step 1:First of all we will create a project and like we will create a project we will see two files activity_main and MainActivity.java whose code given below.

activity_main
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <androidx.viewpager.widget.ViewPager

        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/viewPager"/>


</RelativeLayout>

Here we have used viewPager, with the help of which we will slide the image.Now this layout implement in MainActivity.java class.

MainActivity.java
package com.example.sliderexample;

import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;

import android.os.Bundle;
import android.widget.ListView;

public class MainActivity extends AppCompatActivity {
    ViewPager viewPager;
    ViewPagerAdapter viewPagerAdapter;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewPager=findViewById(R.id.viewPager);
        viewPagerAdapter=new ViewPagerAdapter(this);
        viewPager.setAdapter(viewPagerAdapter);

    }
}
Here we have implemented a class of type ViewPagerAdapter which we have set on viewPager.Whose code given below

ViewPagerAdapter
package com.example.sliderexample;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

import androidx.annotation.NonNull;
import androidx.viewpager.widget.PagerAdapter;
import androidx.viewpager.widget.ViewPager;

public class ViewPagerAdapter extends PagerAdapter {

    private Context context;
    public static final Integer [] img={R.drawable.ic_5g,R.drawable.ic_hand,R.drawable.ic_man,R.drawable.ic_person,R.drawable.ic_send};
    public LayoutInflater inflater;

    public ViewPagerAdapter(Context context) {
        this.context=context;

    }

    @Override
    public int getCount() {
        return img.length;
    }

    @Override
    public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
        return view==object;
    }

    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {
       inflater= (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
       View view=inflater.inflate(R.layout.custom_layout,null);
        ImageView imageView=view.findViewById(R.id.slider);
        imageView.setImageResource(img[position]);
        ViewPager viewPager=(ViewPager) container;
        viewPager.addView(view);
        return view;
    }

    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
        ViewPager viewPager=(ViewPager) container;
        View view=(View)object;
        viewPager.removeView(view);
       // super.destroyItem(container, position, object);
    }
}
In this class we have stored all the images in an integer type array and to show all these images we have used a layout custom_layout inside which we have used an ImageView.

Thanks

Post a Comment

0 Comments