ScrollingPagerIndicator

Pager indicator inspired by Instagram. Lightweight and easy to set up.

Supports ViewPager, RecyclerView and attaching to custom pagers.

Getting started

Add dependency to Gradle script:

implementation "ru.tinkoff.scrollingpagerindicator:scrollingpagerindicator:x.x.x"

Attach to ViewPager

1. Ensure that you have ViewPager in dependencies:

implementation "androidx.viewpager:viewpager:x.x.x"

or

implementation "androidx.viewpager2:viewpager2:x.x.x"

or

implementation "androidx.recyclerview:recyclerview:x.x.x"

2. Add view to layout:

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

<ru.tinkoff.scrollingpagerindicator.ScrollingPagerIndicator
    android:id="@+id/indicator"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

There is no possibility to set fixed indicator width (because it's width is based on spi_visibleDotCount).

3. Attach indicator to ViewPager:

ViewPager pager = findViewById(R.id.pager);
pager.setAdapter(new DemoPagerAdapter());
ScaledDotsIndicator indicator = findViewById(R.id.indicator);
indicator.attachToPager(pager);

Attach to RecyclerView

1. Ensure that you have RecyclerView in dependencies:

implementation "com.android.support:recyclerview-v7:x.x.x"

2. Add view to layout:

<android.support.v7.widget.RecyclerView
    android:id="@+id/recycler"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

<ru.tinkoff.scrollingpagerindicator.ScrollingPagerIndicator
    android:id="@+id/indicator"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

3. Attach indicator to RecyclerView:

RecyclerView recyclerView = findViewById(R.id.recycler);
LayoutManager layoutManager = new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false);
recyclerView.setLayoutManager(layoutManager);
DemoRecyclerViewAdapter recyclerAdapter = new DemoRecyclerViewAdapter();
recyclerView.setAdapter(recyclerAdapter);

ScrollingPagerIndicator recyclerIndicator = findViewById(R.id.indicator);
recyclerIndicator.attachToRecyclerView(recyclerView);

4. Determine which page is current in RecyclerView:

Use attachToRecyclerView(RecyclerView) if current page of the recycler is centered. Like this:

+------------------------------+
|---+  +----------------+  +---|
|   |  |     current    |  |   |
|   |  |      page      |  |   |
|---+  +----------------+  +---|
+------------------------------+

Use attachToRecyclerView(RecyclerView recyclerView, int currentPageLeftCornerX) if current page of the recycler isn't centered. Like this:

+-|----------------------------+
| +--------+  +--------+  +----+
| | current|  |        |  |    |
| |  page  |  |        |  |    |
| +--------+  +--------+  +----|
+-|----------------------------+
  |
  | currentPageLeftCornerX

In both cases all views in RecyclerView must have the same width. Only LinearLayoutManager is supported.

Attach to any custom pager

If you want to attach indicator to some custom pager, you have to implement ScrollingPagerIndicator.PagerAttacher interface. You can take look at ru.tinkoff.scrollingpagerindicator.ViewPagerAttacher as implementation example. And then you can attach your pager like this:

indicator.attachToPager(pager, new ViewPagerAttacher());

Customization

TODO

1. Some extreme customizations may work incorrect.
2. There is no possibility to set fixed indicator width (because it's width is based on spi_visibleDotCount).

License

Copyright 2018 Tinkoff Bank

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.