How to Use multiple fragments in each screen in ViewPager in android

(1)Create layout which contain ViewPager.

e.g: my_pager.xml


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:padding="4dip"
        android:gravity="center_horizontal"
        android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/bg_only_main">

    <android.support.v4.view.ViewPager
            android:id="@+id/pager"
            android:layout_width="match_parent"
            android:layout_height="0px"
            android:layout_weight="1">
    </android.support.v4.view.ViewPager>

</LinearLayout>

(2)Create layout where you are going to add your fragment.

e.g: my_container.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent">

  <LinearLayout android:id="@+id/mod" android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="match_parent" >

       <FrameLayout android:id="@+id/Mod11" android:layout_width="331dp"
android:layout_height="589dp" android:layout_marginLeft="100dp" android:layout_marginTop="45dp" />

   <FrameLayout android:id="@+id/Mod22" android:layout_width="331dp"
android:layout_height="589dp" android:layout_marginLeft="10dp" android:layout_marginTop="45dp" />

<FrameLayout android:id="@+id/Mod33" android:layout_width="331dp"
android:layout_height="589dp" android:layout_marginLeft="10dp" android:layout_marginTop="45dp" />

   </LinearLayout>



</LinearLayout>


(3)create your activity class which will inflate your my_pager.xml and set adapter for your viewpager.


e.g: MyActivity.java


public class MyActivity extends Activity {

private ViewPager modulePager;
private static int NUM_PAGER_VIEWS = 3;


@Override
public void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
           setContentView(R.layout. my_pager.xml)
            modulePager = (ViewPager) getView().findViewById(R.id.pager);
modulePager.setAdapter(new ModulePagerAdapter());

}


private class ModulePagerAdapter extends PagerAdapter {

@Override
public int getCount() {
return NUM_PAGER_VIEWS;
}


@Override
public Object instantiateItem(View collection, int position) {

View v  =getActivity().getLayoutInflater().inflate(
R.layout.my_container.xml, null);


FragmentManager fm = getFragmentManager();
FragmentTransaction ft = fm.beginTransaction();

if (position == 0) {


ft.add(R.id.Mod11, new HotFragment(), "a");

ft.add(R.id.Mod22, new WatchingFragment(),
"b");

ft.add(R.id.Mod33, new TodayFragment(), "c");

} else if (position == 1) {



ft.add(R.id.Mod11, new TodayFragment(), "d");

ft.add(R.id.Mod22, new WatchingFragment(),
"f");

ft.add(R.id.Mod33, new TodayFragment(), "g");

} else if (position == 2) {


ft.add(R.id.Mod11, new ModuleFragment(), "h");

ft.add(R.id.Mod22, new WatchingFragment(),
"i");

ft.add(R.id.Mod33, new ModuleFragment(), "j");

}

  ft.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_FADE);
ft.commit();

((ViewPager) collection).addView(v, 0);

return v;
}

@Override
public void destroyItem(View collection, int position, Object view) {
((ViewPager) collection).removeView((LinearLayout) view);
}

@Override
public boolean isViewFromObject(View view, Object object) {
return view == ((LinearLayout) object);
}

@Override
public void finishUpdate(View arg0) {
}

@Override
public Parcelable saveState() {
return null;
}

@Override
public void startUpdate(View arg0) {
}

@Override
public void restoreState(Parcelable arg0, ClassLoader arg1) {
// TODO Auto-generated method stub

}

}

}