Add a indicator for Viewpager

Tian は two objects and えず

Viewpager is a conscience component provided by Android, with it can achieve a horizontal sliding paging function in minutes, in which the full screen image with Viewpager is a more classic use of the scene, first look at:

There is a row of circles at the bottom of each page, a solid circle indicating the currently displayed picture, which moves as the finger slides, which we can call Viewpager's indicator.

This function is also relatively simple, first define a horizontal linearlayout used to display the indicator, and then put the LinearLayout and Viewpager as a child element in a framelayout, so indicator LinearLayout will be displayed on the upper level of the Viewpager, initially achieved the display effect, but the sliding effect has not been achieved.

First, create a new subclass of LinearLayout-CirclePageIndicator

publicclass CirclePageIndicator extends LinearLayout

If you want to implement this class gracefully, you can refer to how to customize a view gracefully in Android.

Add indicator According to the page number of Viewpager, here first define this method, wait for later to see again use.

private  void  addindicator  (int  count) {for  (int  i = 0 ; I < count; i++) {ImageView img = new  ImageView (GetContext ()); Layoutparams params = new  layoutparams (layoutparams.wrap_content, Layout Params.wrap_content); Params.leftmargin = indicatorspacing; Params.rightmargin = indicatorspacing; Img.setimageresource (R.drawable.circle_indicator_stroke); AddView (IMG, params); } if  (Count > 0 ) {(ImageView) Getchildat (0 )). Setimageresource (R.drawable.circle_indicator_solid); }}

I want the circlepageindicator to be simple enough to attach to viewpager with just one statement.

CirclePageIndicator indicator = (CirclePageIndicator) findViewById(R.id.indicator);indicator.setViewPager(pager);

Then we'll add the Setviewpager method for Circlepageindicator.

publicvoidsetViewPager(ViewPager pager) {    userDefinedPageChangeListener = getOnPageChangeListener(pager);    pager.setOnPageChangeListener(this);    addIndicator(pager.getAdapter().getCount());}

In order to be able to monitor Viewpager pagechange time, let Circlepageindicator realize Viewpager.onpagechangelistener this interface, and then in Setviewpager, for the View Pager Add this listener.

However, this problem again, if viewpager in before the listener, it is clear that the previous listener to cover out, this is good to do, a little hack, with reflection before the listener to get it.

privategetOnPageChangeListener(ViewPager pager) {    try {        Field f = pager.getClass().getDeclaredField("mOnPageChangeListener");        f.setAccessible(true);        return (ViewPager.OnPageChangeListener) f.get(pager);    catch (NoSuchFieldException e) {        e.printStackTrace();    catch (IllegalAccessException e) {        e.printStackTrace();    }    returnnull;}

The rest of the ViewPager.OnPageChangeListener method implementation, according to the page changes update indicator is complete.

Poke Source

Add a indicator for Viewpager