Introduction

Paging indicator widgets compatible with the ViewPager from the Android Support Library and ActionBarSherlock. Originally based on Patrik Åkerfeldt's ViewFlow.

When using the ViewPager widget it is not always obvious to the user that there are adjacent views they can navigate to. By implementing this widget you provide a clear indicator that there exists additional content which they can click or swipe to see.

At present there are five styles of indicators which can be used:

Title Indicator Displays the title of the selected page in the center with the titles of the adjacent pages (if available) in a more subtle style.
Tab Indicator Similar to the title indicator but displays as many titles as possible in scrolling and animated horizontal tabs.
Circle Indicator Simple indication of the number of pages available in the pager with a separate drawing style for the currently selected page.
Line Indicator Similar to the circle indicator but draws very a very subtle line for each page with a separate drawaing style for the current page.
Underline Indicator Mimics the indicator on the Ice Cream Sandwich application launcher with a fading line the moves with each page.

Download

Version 2.3.1 — 2012-05-19

Download ZIP Download TGZ

Change Log

• New LinePageIndicator! Draws small indicators lines much like the circle indicator but much more subtle.
• New UnderlinePageIndicator! Acts like the indicator on the Ice Cream Sandwich application launcher.
• Circle indicator now uses android:orientation rather than custom attribute.
• Title indicator adapter callback now uses the standard getPageTitle(int) method introduced in the r6 version of the support library.
• Title indicator now uses android:textSize and android:textColor in its styles.
• Fix: Do not create objects in drawing, layout, or measurement steps of each indicator.
• Fix: Improve offset detection when page margins are in use on the pager.
• Maven: The dependency on the support library is now using an artifact from central rather than requiring you to deploy your own locally

Looking for an older version? Check here.

Try out the sample application:

Usage

1. Include one of the widgets in your view. This should usually be placed adjacent to the ViewPager it represents.

   <com.viewpagerindicator.TitlePageIndicator
   	android:id="@+id/titles"
   	android:layout_height="wrap_content"
   	android:layout_width="fill_parent" />

2. In your onCreate method (or onCreateView for a fragment), bind the indicator to the ViewPager.

   //Set the pager with an adapter
   ViewPager pager = (ViewPager)findViewById(R.id.pager);
   pager.setAdapter(new TestAdapter(getSupportFragmentManager()));
   
   //Bind the title indicator to the adapter
   TitlePageIndicator titleIndicator = (TitlePageIndicator)findViewById(R.id.titles);
   titleIndicator.setViewPager(pager);

   Note: If you are using TitlePageIndicator your adapter must implement TitleProvider.
3. (Optional) If you use an OnPageChangeListener with your view pager you should set it in the indicator rather than on the pager directly.

   //continued from above
   titleIndicator.setOnPageChangeListener(mPageChangeListener);

For more examples please take a look at the source code to the samples.

Implementations

Credits

© 2011 Jake Wharton — @JakeWharton · +JakeWharton

Developed and distributed under the Apache License, Version 2.0.

Originally based on widgets developed by Patrik Åkerfeldt.