Search code examples
androidpagertabstrip

Navigate inside PagerTabStrip titles without changing the views?


I wanted to navigate between a large amount of views So I implemented ViewPager with PagerTabStrip. Now I want to be able to go from first title to last title without changing the view, if you notice that PlayStore have implemented that.

The PagerTabStrip only go to next or previous title and changes the view, since I have a lot of views I found that it annoys the user.

I found XLPagerTabStrip for iOS, but I couldn't find one for android.


Solution

  • You can make use of PagerSlidingTabStrip,

    For a working implementation of this project see the sample/ folder.

    Include the library as local library project or add the dependency in your build.gradle.

    dependencies {
        compile 'com.astuetz:pagerslidingtabstrip:1.0.1'
    }
    

    Include the PagerSlidingTabStrip widget in your layout. This should usually be placed above the ViewPager it represents.

    <com.astuetz.PagerSlidingTabStrip
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="48dip" />
    

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

    // Initialize the ViewPager and set an adapter
    ViewPager pager = (ViewPager) findViewById(R.id.pager);
     pager.setAdapter(new TestAdapter(getSupportFragmentManager()));
    
    // Bind the tabs to the ViewPager
    PagerSlidingTabStrip tabs = (PagerSlidingTabStrip) findViewById(R.id.tabs);
     tabs.setViewPager(pager);
    

    (Optional) If you use an OnPageChangeListener with your view pager you should set it in the widget rather than on the pager directly.

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