Only show 5 dot indicators for viewpager remaining i need to hide

Question

I added dot indicators for viewpager, In that viewpages when I have 15 datas, dot indicators also 15 dots showing. but I don't want that I need to show only 5 dot indicators eventhough I'm having 20 datas in my view pager

 private fun setUpTabs(binding: FragmentHomeBinding, viewpager: ViewPagerAdapter) {
    binding.viewPagerNews.adapter = viewpager
    binding.indicatorContainer.setViewPager(binding.viewPagerNews)
}

I need to show like this

I'm getting like this

Answer 1

You can use ScrollingPagerIndicator to show only 5 dots at a time and make it scrollable at user swipe through pages.

Dependency

implementation "ru.tinkoff.scrollingpagerindicator:scrollingpagerindicator:1.2.0"

Layout

<androidx.viewpager.widget.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"
    app:spi_dotColor="@color/red"               // unselected dot color
    app:spi_dotSelectedColor="@color/teal_200"  // selected dot color
    app:spi_visibleDotCount="5"                 // max dot to be visible
    app:spi_dotSize="5dp"                       // dot sizes
     />

Attach indicator to your Viewpager

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

You can also use this with ViewPager2 or RecyclerView.

Setup ViewPager2 with indicator

    ViewPager2 pager2 = findViewById(R.id.pager2);
    DemoRecyclerViewAdapter pagerAdapter2 = new DemoRecyclerViewAdapter();
    pager2.setAdapter(pagerAdapter2);

    ScrollingPagerIndicator pagerIndicator2 = findViewById(R.id.pager_indicator2);
    pagerIndicator2.attachToPager(pager2);