CircleIndicator

Additional

Language
Java
Version
2.1.2 (May 26, 2019)
Created
Jul 30, 2014
Updated
Jun 12, 2019
Owner
relex (ongakuer)
Contributors
polok
relex (ongakuer)
Nam Nguyen Hoai (eneim)
bhbfhfb
anasanasanas123
daniellAlgar
zhehuaz
lzzy12
8
Activity
Badge
Generate
Download
Source code
APK file

Promotion

CircleIndicator

A lightweight indicator like in nexus 5 launcher

Gradle

AndroidX
dependencies {
    implementation 'me.relex:circleindicator:2.1.2'
}
Android Support Library
dependencies {
    implementation 'me.relex:circleindicator:1.2.2'
}

Usage

ViewPager
<me.relex.circleindicator.CircleIndicator
 android:id="@+id/indicator"
 android:layout_width="match_parent"
 android:layout_height="48dp"/>
ViewPager viewpager = (ViewPager) view.findViewById(R.id.viewpager);
viewpager.setAdapter(adapter);

CircleIndicator indicator = (CircleIndicator) view.findViewById(R.id.indicator);
indicator.setViewPager(viewpager);

// optional
adapter.registerDataSetObserver(indicator.getDataSetObserver());
RecyclerView
<me.relex.circleindicator.CircleIndicator2
 android:id="@+id/indicator"
 android:layout_width="match_parent"
 android:layout_height="48dp"/>
RecyclerView recyclerView = view.findViewById(R.id.recycler_view);
recyclerView.setLayoutManager(layoutManager);
recyclerView.setAdapter(adapter);

PagerSnapHelper pagerSnapHelper = new PagerSnapHelper();
pagerSnapHelper.attachToRecyclerView(recyclerView);

CircleIndicator2 indicator = view.findViewById(R.id.indicator);
indicator.attachToRecyclerView(recyclerView, pagerSnapHelper);

// optional
adapter.registerAdapterDataObserver(indicator.getAdapterDataObserver());
ViewPager2
<me.relex.circleindicator.CircleIndicator3
 android:id="@+id/indicator"
 android:layout_width="match_parent"
 android:layout_height="48dp"/>
ViewPager2 viewpager = view.findViewById(R.id.viewpager);
viewpager.setAdapter(mAdapter);

CircleIndicator3 indicator = view.findViewById(R.id.indicator);
indicator.setViewPager(viewpager);

// optional
adapter.registerAdapterDataObserver(indicator.getAdapterDataObserver());
Properties:
  • app:ci_width
  • app:ci_height
  • app:ci_margin
  • app:ci_drawable
  • app:ci_drawable_unselected
  • app:ci_animator
  • app:ci_animator_reverse
  • app:ci_orientation (default:horizontal)
  • app:ci_gravity (default:center)