In the below example I have created a GridView with in Viewpager. Here in activity_main.xml layout , I have added ToolBar, ImageView , TextView, TabLayout, Viewpager. In second step I have created three fragments xml layouts. In fragment_three.xml I have added a GridView.
In third step I have created image_inflater.xml layout here I have added a ImageView. Now see the code in MainActivity, in this I have used setupViewPager method, In this method I have add three fragments classes OneFragment, TwoFragment and Three Fragment class. In ThreeFragment class I have added GriedView. After this in next step I have created a GridViewAdapter and ViewHolder class for using GridView.
You can see below example code it clearly describes How to create Grid View with in View pager .
 
Step(1)activity_main.xml layout-
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorPrimary"
        />
    <RelativeLayout
        android:id="@+id/collapsing_toolbar"
        android:layout_width="match_parent"
        android:layout_below="@+id/toolbar"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <ImageView
            android:id="@+id/ivimg"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:background="@drawable/collepsei"/>
        <TextView
            android:paddingTop="120dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Doon IT Fair"
            android:paddingLeft="5dp"
            android:textSize="24dp"
            android:id="@+id/tvDoon"
            android:textColor="#fff"/>
    </RelativeLayout>
    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        android:background="#ECECEC"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/collapsing_toolbar"/>
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/tabs">
        <android.support.v4.view.ViewPager
            android:id="@+id/viewpager"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_above="@+id/imageView"/>
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:background="@android:color/holo_green_dark"
            android:layout_alignParentBottom="true"
            android:id="@+id/imageView" />
    </RelativeLayout>
</RelativeLayout>
Step(2)Created a new fragment_one.xml layout-
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="info.androidhive.materialtabs.fragments.OneFragment">
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="One"
    android:textSize="40dp"
    android:textStyle="bold"
    android:layout_centerInParent="true"/>
</RelativeLayout>
</RelativeLayout>
Step(3)Created a new fragment_two.xml layout-
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="info.androidhive.materialtabs.fragments.OneFragment">
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Two"
    android:textSize="40dp"
    android:textStyle="bold"
    android:layout_centerInParent="true"/>
</RelativeLayout>
 
Step(4)Created a new fragment_three.xml layout-
<?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">
    <GridView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/gridViewFragmentThree"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:horizontalSpacing="1dip"
        android:numColumns="3"
        android:stretchMode="columnWidth"
        android:verticalSpacing="1dip" />
</LinearLayout>
Step(5)Created a new image_inflter.xml layout-
<?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"
    android:gravity="center">
    <ImageView
        android:id="@+id/ivImageInflator"
        android:layout_width="70dp"
        android:layout_height="70dp"
        android:layout_marginBottom="10dp"
        android:layout_marginTop="10dp"/>
</LinearLayout>
 
Step(6) MainActivity-
public class MainActivity extends AppCompatActivity {
    public static MainActivity instance;
    private Toolbar toolbar;
    private TabLayout tabLayout;
    private ViewPager viewPager;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        viewPager = (ViewPager) findViewById(R.id.viewpager);
        setupViewPager(viewPager);
        tabLayout = (TabLayout) findViewById(R.id.tabs);
        tabLayout.setupWithViewPager(viewPager);
    }
    public static MainActivity getInstance() {
        return instance;
    }
    private void setupViewPager(ViewPager viewPager) {
        ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
        adapter.addFrag(new OneFragment(), "ONE");
        adapter.addFrag(new TwoFragment(), "TWO");
        adapter.addFrag(new ThreeFragment(), "THREE");
        viewPager.setAdapter(adapter);
    }
    class ViewPagerAdapter extends FragmentPagerAdapter {
        private final List<Fragment> mFragmentList = new ArrayList<>();
        private final List<String> mFragmentTitleList = new ArrayList<>();
        public ViewPagerAdapter(FragmentManager manager) {
            super(manager);
        }
        @Override
        public Fragment getItem(int position) {
            return mFragmentList.get(position);
        }
        @Override
        public int getCount() {
            return mFragmentList.size();
        }
        public void addFrag(OneFragment fragment, String title) {
            mFragmentList.add(fragment);
            mFragmentTitleList.add(title);
        }
        @Override
        public CharSequence getPageTitle(int position) {
            return mFragmentTitleList.get(position);
        }
    }
}
Step(7)- Created OneFragment class-
public class OneFragment extends Fragment {
    public OneFragment() {
        // Required empty public constructor
    }
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragmnet_one, container, false);
    }
}
Step(8) Created TwoFragment class-
public class TwoFragment extends OneFragment {
    public TwoFragment() {
        // Required empty public constructor
    }
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragmnet_two, container, false);
    }
}
 
Step(9)Created a ThreeFragment class-
public class ThreeFragment extends OneFragment {
    private GridView gridView;
    ArrayList<Drawable>all_images ;
    private TypedArray allImages;
    public ThreeFragment() {
        // Required empty public constructor
    }
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View rootView = inflater.inflate(R.layout.fragment_three,null);
        all_images = new ArrayList<>();
        getAllWidgets(rootView);
        // Inflate the layout for this fragment
        return rootView;
    }
    private void getAllWidgets(View rootView) {
        gridView =(GridView)rootView.findViewById(R.id.gridViewFragmentThree);
        allImages =getResources().obtainTypedArray(R.array.all_images);
        setAdapter();
    }
    private void setAdapter(){
        for (int i=0;i<allImages.length();i++){
            all_images.add(allImages.getDrawable(i));
        }
        GridViewAdapter gridViewAdapter = new GridViewAdapter(getActivity(), all_images);
        gridView.setAdapter(gridViewAdapter);
    }
}
Step(10)Created GridViewAdapter.java class -
public class GridViewAdapter extends BaseAdapter {
        public ArrayList<Drawable> allItemsResourceID;
        private LayoutInflater inflater;
        Context context;
        public GridViewAdapter(Context context, ArrayList<Drawable> images) {
            this.context = context;
           inflater = LayoutInflater.from(context);
            allItemsResourceID = images;
            Log.d("Adapter", "Create Image Adapter " + allItemsResourceID.size());
        }
        GridViewAdapter(Context context) {
            inflater = LayoutInflater.from(context);
        }
        @Override
        public int getCount() {
            return allItemsResourceID.size();
        }
        @Override
        public Object getItem(int position) {
            return allItemsResourceID.get(position);
        }
        @Override
        public long getItemId(int position) {
            return position;
        }
        @Override
        public View getView(final int position, View convertView, ViewGroup parent) {
            final ViewHolder holder;
            View view = convertView;
            if (view == null) {
                view = inflater.inflate(R.layout.image_inflater, parent, false);
                holder = new ViewHolder();
                assert view != null;
                holder.imageView = (ImageView) view.findViewById(R.id.ivImageInflator);
                view.setTag(holder);
            } else {
                holder = (ViewHolder) view.getTag();
            }
            if (!allItemsResourceID.get(position).equals("")) {
                holder.imageView.setImageDrawable(allItemsResourceID.get(position));
            }
            return view;
        }
    }
class ViewHolder {
    ImageView imageView;
}
 
Step(11)Add items in String.xml layout
 <string-array name="all_images">
        <item>@drawable/one</item>
        <item>@drawable/two</item>
        <item>@drawable/g4</item>
        <item>@drawable/one</item>
        <item>@drawable/two</item>
        <item>@drawable/g4</item>
        <item>@drawable/one</item>
        <item>@drawable/two</item>
        <item>@drawable/g4</item>
    </string-array>
                       
                    
0 Comment(s)