adalpari/NumberedViewPager

ViewPager with numbers indication position and total

Download

Step 1. Add the JitPack repository to your build file

Add it in your root settings.gradle at the end of repositories:

	dependencyResolutionManagement {
		repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
		repositories {
			mavenCentral()
			maven { url 'https://jitpack.io' }
		}
	}

Add it in your settings.gradle.kts at the end of repositories:

	dependencyResolutionManagement {
		repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
		repositories {
			mavenCentral()
			maven { url = uri("https://jitpack.io") }
		}
	}

Add to pom.xml

	<repositories>
		<repository>
		    <id>jitpack.io</id>
		    <url>https://jitpack.io</url>
		</repository>
	</repositories>

Add it in your build.sbt at the end of resolvers:

 
    resolvers += "jitpack" at "https://jitpack.io"

Add it in your project.clj at the end of repositories:

 
    :repositories [["jitpack" "https://jitpack.io"]]

Step 2. Add the dependency

	dependencies {
		implementation 'com.github.adalpari:NumberedViewPager:1.1'
	}

	dependencies {
		implementation("com.github.adalpari:NumberedViewPager:1.1")
	}

	<dependency>
	    <groupId>com.github.adalpari</groupId>
	    <artifactId>NumberedViewPager</artifactId>
	    <version>1.1</version>
	</dependency>


                            
    libraryDependencies += "com.github.adalpari" % "NumberedViewPager" % "1.1"


                            
    :dependencies [[com.github.adalpari/NumberedViewPager "1.1"]]

Readme

NumberedViewPager

A simple ViewPager with a number indicator to know the current / total items on it.

demo gif

How to use

1.- Add the library into gradle

allprojects {
  repositories {
  ...
  maven { url 'https://jitpack.io' }
  }
}

dependencies {
  implementation 'com.github.adalpari:NumberedViewPager:1.1'
}

2.- Add the NumberedViewPagerHandler into your layout. This View replace the RecyclerView you are using.

<adalpari.github.com.numberedviewpager.NumberedViewPagerHandler
        android:id="@+id/numbered_view_page_handler"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        custom:nc_color="#494949"
        custom:nc_text_color="#ffffff"/>

custom:nc_color is the background color of the counter

custom:nc_text_color is the text color of the counter

Don't forget to add the custom scheem in the top paent view xmlns:custom="http://schemas.android.com/apk/res-auto"

3.- Get the NumberedViewPagerHandler in your class and add the PagerAdapter

NumberedViewPagerHandler numberedViewPagerHandler = findViewById(R.id.numbered_view_page_handler);
numberedViewPagerHandler.setAdapter(new CustomPagerAdapter(MY_VARIABLES));

4.- Add onDestoy call

In order to avoid memory leaks, call numberedViewPagerHandler.onDestroy() when your activity is destroyed.

@Override
protected void onDestroy() {
    numberedViewPagerHandler.onDestroy();
    super.onDestroy();
}

Important

You can get the embedded ViewPager from the NumberedViewPagerHandler. But, if you want to subscribe to OnPageChangeListener, don't do it directly, use NumberedViewPagerHandler.setOnPageChangeListener(...) instead.

ViewPager internalViewPager = numberedViewPagerHandler.getViewPager();
        
...

numberedViewPagerHandler.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
        // your code
    }

    @Override
    public void onPageSelected(int position) {
        // your code
    }

    @Override
    public void onPageScrollStateChanged(int state) {
        // your code
    }
});