In this post I will explain how we can create custom image slider using ViewPager and also implement image zoom in it. This post really helpful if you want to implement a custom image slider with zoom effect and load images from WebAPI. So without wasting time lets start building an application.

Step 1. Create a new application in your Android Studio.

Step 2. Now open your AndroidManifest.xml and add Internet permission.

Step 3. Now open project build.gradle file and add repositories as shown below

Step 4. Now open app build.gradle and add required dependencies.

I am using Glide to load the image from URL and PhotoView library to add a zoom effect on Images.

Step 5. Now we can create a class basically getter setter which holds our data.

Step 6. Now we can create a Layout file for our adapter. Create a new file (pager_item.xml) in res -> layout directory.

Step 7. Now create our adapter class Pager which extends PagerAdapter.

Step 8. Now open activity_main.xml file and call ViewPager in the file as shown below.

Step 9. Now we can call or Adapter and load images and create our viewpager.

That’s it. In the above code, there is nothing complex to understand, we simply create ArrayList and create an object of our ImageModel and save that object in ArrayList and later we can pass that array to Adapter(Pager). Hope this post helps you.