Skip to content

Dots indicator that shows the current position on a View Pager. It does all the work for you with a few customisations.

License

Notifications You must be signed in to change notification settings

tizisdeepan/dots

Repository files navigation

Dots

License

Screenshot 2

What is Dots?

Dots is a library that helps in implementing a simple yet effective dots indicator for the View Pagers used in your android code. It combines the usage of observers and state drawables to indicate the current visible page's position in a badass way.

Implementation

[1] In your app module gradle file

dependencies {
    implementation 'com.github.tizisdeepan:dots:1.0.1'
}

[2] In your project level gradle file

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

[3] Use DotsIndicator in your layout.xml

<com.make.dots.dotsindicator.DotsIndicator
    android:id="@+id/dotsIndicator"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginBottom="12dp"
    android:background="@drawable/dots_background"
    android:padding="6dp"
    app:dot_drawable="@drawable/ic_dot_darkgrey"
    app:dot_drawable_unselected="@drawable/ic_dot_lightgrey"
    app:dot_height="8dp"
    app:dot_margin="6dp"
    app:dot_width="8dp" />

[4] Link the View Pager with the Dots Indicator in your Java / Kotlin code

dotsIndicator.setViewPager(imageViewPager)
imageViewPager.adapter?.registerDataSetObserver(dotsIndicator.dataSetObserver)

Documentation

XML

  1. dot_drawable: Drawable that is used to indicated the current selected page
  2. dot_drawable_unselected: Drawable that is used to indicated the unselected pages
  3. dot_height: Height of the Dot indicator in dp
  4. dot_width: Width of the Dot indicator in dp
  5. dot_margin: Marginal spaces between the Dots

Kotlin / Java

// This attaches the DotsIndicator with the ViewPager
DotsIndicator.setViewPager(ViewPager)

Voila! You have implemented a simple Dots indicator for your View Pager now!

Check out this medium publication: https://medium.com/@tizisdeepan/android-dots-indicator-a093d9dc3f5f

Developed By

Follow me on Twitter Add me to Linkedin

License

This library falls under Apache v2