Android ViewPager with Bubble Seek bar

build.gradle

apply plugin: 'com.android.application'

android {
    compileSdkVersion 26
    defaultConfig {
        applicationId "com.suresh.viewpagerdemo"
        minSdkVersion 16
        targetSdkVersion 26
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
        vectorDrawables.useSupportLibrary = true
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation 'com.android.support:appcompat-v7:26.1.0'
    implementation 'com.android.support:design:26.1.0'
    implementation 'com.android.support.constraint:constraint-layout:1.0.2'
    implementation 'com.android.support:support-vector-drawable:26.1.0'
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'com.android.support.test:runner:1.0.1'
    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.1'

    compile('com.github.ozodrukh:CircularReveal:2.0.1@aar') {
        transitive = true;
    }

    //Custom Seekbar
    compile 'com.xw.repo:bubbleseekbar:3.16'
}

repositories {
    maven {
        url "https://jitpack.io"
    }
}

layout_pager_test.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/layout_parent"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v4.view.ViewPager
        android:id="@+id/pager_demo"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <Button
        android:id="@+id/button_next"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="50dp"
        android:text="NEXT" />

</RelativeLayout>

MainActivity.java

package com.suresh.viewpagerdemo.pager_test;

import android.animation.Animator;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewAnimationUtils;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.TextView;

import com.suresh.viewpagerdemo.R;
import com.xw.repo.BubbleSeekBar;

/**
 * Created by Suresh on 06-Mar-18.
 */

public class MainActivity extends AppCompatActivity {
    private ViewPager mViewPagerDemo;
    private int[] mLayoutSlides;
    private Button mButtonNext;
    private PagerAdapter mPagerAdapter;
    private int[] mValues = {50, 75, 25, 100, 75};

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

        mLayoutSlides = new int[]{R.layout.pager_test_1,
                R.layout.pager_test_2,
                R.layout.pager_test_3,
                R.layout.pager_test_4,
                R.layout.pager_test_5};
        mViewPagerDemo = findViewById(R.id.pager_demo);

        mButtonNext = findViewById(R.id.button_next);
        mButtonNext.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                int mPosX = (int) (v.getX() + v.getWidth() / 2);
                int mPosY = (int) (v.getY() + v.getHeight() / 2);
                float finalRadius = (float) (Math.max(mViewPagerDemo.getWidth(), mViewPagerDemo.getHeight()) * 1.1);
                if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP) {
                    Animator anim = ViewAnimationUtils.createCircularReveal(mViewPagerDemo, mPosX, mPosY, 0, finalRadius);
                    anim.start();
                }
                mViewPagerDemo.setCurrentItem(mViewPagerDemo.getCurrentItem() + 1);
            }
        });
        mPagerAdapter = new PagerAdapter();
        mViewPagerDemo.setAdapter(mPagerAdapter);
    }

    class PagerAdapter extends android.support.v4.view.PagerAdapter {
        private LayoutInflater layoutInflater;
        private TextView textTitle;
        private BubbleSeekBar seekBarDemo;

        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            layoutInflater = (LayoutInflater) getSystemService(LAYOUT_INFLATER_SERVICE);
            View view = layoutInflater.inflate(mLayoutSlides[position], container, false);
            textTitle = view.findViewById(R.id.text_title);
            textTitle.setText("SLIDE: " + (position + 1));
            seekBarDemo = view.findViewById(R.id.seekbar_skills_focus);
            seekBarDemo.setProgress(mValues[position]);
            container.addView(view);
            return view;
        }

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

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

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            View view = (View) object;
            view.destroyDrawingCache();
        }
    }
}

pager_test_1.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/holo_red_light"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:id="@+id/text_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textAlignment="center"
        android:textColor="@android:color/white"
        android:textSize="30sp" />

    <com.xw.repo.BubbleSeekBar
        android:id="@+id/seekbar_skills_focus"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@id/button_submit"
        android:layout_marginBottom="50dp"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        app:bsb_always_show_bubble="true"
        app:bsb_always_show_bubble_delay="0"
        app:bsb_auto_adjust_section_mark="true"
        app:bsb_bubble_color="@android:color/white"
        app:bsb_bubble_text_color="#999999"
        app:bsb_second_track_color="@android:color/white"
        app:bsb_section_count="4"
        app:bsb_section_text_color="@android:color/white"
        app:bsb_section_text_position="below_section_mark"
        app:bsb_section_text_size="10sp"
        app:bsb_track_color="#c9c9c9"
        app:bsb_track_size="3dp"
        android:layout_marginTop="100dp"/>


</LinearLayout>

pager_test_2.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/holo_purple"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:id="@+id/text_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textAlignment="center"
        android:textColor="@android:color/white"
        android:textSize="30sp" />

    <com.xw.repo.BubbleSeekBar
        android:id="@+id/seekbar_skills_focus"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@id/button_submit"
        android:layout_marginBottom="50dp"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        app:bsb_always_show_bubble="true"
        app:bsb_auto_adjust_section_mark="true"
        app:bsb_bubble_color="@android:color/white"
        app:bsb_bubble_text_color="#999999"
        app:bsb_second_track_color="@android:color/white"
        app:bsb_section_count="4"
        app:bsb_section_text_color="@android:color/white"
        app:bsb_section_text_position="below_section_mark"
        app:bsb_section_text_size="10sp"
        app:bsb_track_color="#c9c9c9"
        app:bsb_track_size="3dp"
        android:layout_marginTop="100dp"/>


</LinearLayout>

pager_test_3.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/holo_orange_light"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:id="@+id/text_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textAlignment="center"
        android:textColor="@android:color/white"
        android:textSize="30sp" />

    <com.xw.repo.BubbleSeekBar
        android:id="@+id/seekbar_skills_focus"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@id/button_submit"
        android:layout_marginBottom="50dp"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        app:bsb_always_show_bubble="true"
        app:bsb_auto_adjust_section_mark="true"
        app:bsb_bubble_color="@android:color/white"
        app:bsb_bubble_text_color="#999999"
        app:bsb_second_track_color="@android:color/white"
        app:bsb_section_count="4"
        app:bsb_section_text_color="@android:color/white"
        app:bsb_section_text_position="below_section_mark"
        app:bsb_section_text_size="10sp"
        app:bsb_track_color="#c9c9c9"
        app:bsb_track_size="3dp"
        android:layout_marginTop="100dp"/>


</LinearLayout>

pager_test_4.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/holo_blue_dark"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:id="@+id/text_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textAlignment="center"
        android:textColor="@android:color/white"
        android:textSize="30sp" />

    <com.xw.repo.BubbleSeekBar
        android:id="@+id/seekbar_skills_focus"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@id/button_submit"
        android:layout_marginBottom="50dp"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        app:bsb_always_show_bubble="true"
        app:bsb_auto_adjust_section_mark="true"
        app:bsb_bubble_color="@android:color/white"
        app:bsb_bubble_text_color="#999999"
        app:bsb_second_track_color="@android:color/white"
        app:bsb_section_count="4"
        app:bsb_section_text_color="@android:color/white"
        app:bsb_section_text_position="below_section_mark"
        app:bsb_section_text_size="10sp"
        app:bsb_track_color="#c9c9c9"
        app:bsb_track_size="3dp"
        android:layout_marginTop="100dp"/>


</LinearLayout>

pager_test_5.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/holo_green_dark"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:id="@+id/text_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textAlignment="center"
        android:textColor="@android:color/white"
        android:textSize="30sp" />

    <com.xw.repo.BubbleSeekBar
        android:id="@+id/seekbar_skills_focus"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@id/button_submit"
        android:layout_marginBottom="50dp"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:layout_marginTop="100dp"
        app:bsb_always_show_bubble="true"
        app:bsb_auto_adjust_section_mark="true"
        app:bsb_bubble_color="@android:color/white"
        app:bsb_bubble_text_color="#999999"
        app:bsb_second_track_color="@android:color/white"
        app:bsb_section_count="4"
        app:bsb_section_text_color="@android:color/white"
        app:bsb_section_text_position="below_section_mark"
        app:bsb_section_text_size="10sp"
        app:bsb_track_color="#c9c9c9"
        app:bsb_track_size="3dp" />


</LinearLayout>