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,

<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v4.view.PagerTabStrip
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#33B5E5"
android:layout_gravity="top"
android:textColor="#000000" />
</android.support.v4.view.ViewPager>

Now please see my MainActivity and adapter class here,

private ViewPager pager = null;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
pager = (ViewPager) findViewById(R.id.pager);
MyAdapter myAdapter = new MyAdapter(getSupportFragmentManager());
pager.setAdapter(myAdapter);
}
public class MyAdapter extends FragmentPagerAdapter
{
public MyAdapter(FragmentManager fm)
{
super(fm);
}
@Override
public Fragment getItem(int position)
{
Fragment fragment = null;
if (position == 0) fragment = new FragmentA();
if (position == 1) fragment = new FragmentB();
if (position == 2) fragment = new FragmentC();
return fragment;
}
@Override
public int getCount()
{
return 3;
}
@Override
public CharSequence getPageTitle(int position)
{
String title = "Tab 1";
if (position == 0) title = "Tab 1";
if (position == 1) title = "Tab 2";
if (position == 2) title = "Tab 3";
return title;
}
}
}

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,

<android.support.v4.view.PagerTabStrip
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#33B5E5"
android:layout_gravity="top"
android:textColor="#000000" />

getPageTitle() will return the title for the specified title. The output will looks like the following,