Post
Ask Question

Android ViewPager or Scrolling TAB

Create ViewPager in Android

 
A ViewPager in Android is just like a ListView, it takes the views and displays it one at a time and handles switching between views with the help of an adapter just like the ListView does. ViewPager is a layout manager where each child is a separate page. It uses an implementation of PagerAdapter for switching between the views. If you are using fragments for the adapter, then there are two types of fragment adapters, they are FragmentStatePagerAdapter and FragmentPagerAdapter.
 
FragmentPagerAdapter is used for a small fixed number of pages, Each fragment is kept as an object associated with the Activity with its UI destroyed as the user navigates away from it the FragmentStatePagerAdapter is used for a large number of pages and the entire fragment may be destroyed by only keeping its onSaveInstanceState() retained.
 
The task I am going to do here is creating some fragments and adding this into the ViewPager and adding tabs also for this ViewPager.
 
First I will create three fragments. These fragments contain only one textView with layout background as different colors. And I loaded these Fragments to java classes.
 
I am using the android.support.v4.Fragment because Fragments are from Android version 3.0 if I need to support the lower devices then I need to use the support library
 
Now I create the main_activity layout file with View pager and ViewPagerTitleStrip, please see the xml file,
  1. <android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"    
  2. android:id="@+id/pager"    
  3. android:layout_width="match_parent"    
  4. android:layout_height="match_parent" >    
  5. <android.support.v4.view.PagerTabStrip    
  6. android:layout_width="match_parent"    
  7. android:layout_height="wrap_content"    
  8. android:background="#33B5E5"    
  9. android:layout_gravity="top"    
  10. android:textColor="#000000" />    
  11. </android.support.v4.view.ViewPager>   
    Now please see my MainActivity and adapter class here,
    1. private ViewPager pager = null;    
    2. @Override    
    3. protected void onCreate(Bundle savedInstanceState)     
    4. {    
    5.     super.onCreate(savedInstanceState);    
    6.     setContentView(R.layout.activity_main);    
    7.     pager = (ViewPager) findViewById(R.id.pager);    
    8.     MyAdapter myAdapter = new MyAdapter(getSupportFragmentManager());    
    9.     pager.setAdapter(myAdapter);    
    10. }    
    11. public class MyAdapter extends FragmentPagerAdapter     
    12. {    
    13.     public MyAdapter(FragmentManager fm)    
    14.     {    
    15.         super(fm);    
    16.     }    
    17.     @Override    
    18.     public Fragment getItem(int position)    
    19.     {    
    20.         Fragment fragment = null;    
    21.         if (position == 0) fragment = new FragmentA();    
    22.         if (position == 1) fragment = new FragmentB();    
    23.         if (position == 2) fragment = new FragmentC();    
    24.         return fragment;    
    25.     }    
    26.     @Override    
    27.     public int getCount()    
    28.     {    
    29.         return 3;    
    30.     }    
    31.     @Override    
    32.     public CharSequence getPageTitle(int position)     
    33.     {    
    34.         String title = "Tab 1";    
    35.         if (position == 0) title = "Tab 1";    
    36.         if (position == 1) title = "Tab 2";    
    37.         if (position == 2) title = "Tab 3";    
    38.         return title;    
    39.     }    
    40. }    
    41. }   
      getItem() in the adapter will return the fragment at the given position,
       
      getCount() will return the total number or pages/fragments here i given it as 3 because I have three fragments here, For adding title inside the ViewPager we are using the following in the xml file,
      1. <android.support.v4.view.PagerTabStrip    
      2. android:layout_width="match_parent"    
      3. android:layout_height="wrap_content"    
      4. android:background="#33B5E5"    
      5. android:layout_gravity="top"    
      6. android:textColor="#000000" />   
        getPageTitle() will return the title for the specified title. The output will looks like the following,
         
         
        Read more articles on Android


        Similar Articles