Android View Pager

What is View Pager ?

ViewPager is the widget that allows the user to swipe left or right to see an entirely new screen.

ViewPager has the ability to dynamically add and remove pages (or tabs) at anytime.

ViewPager are user could then swipe left or right to see other categorized lists. Using the ViewPager requires some knowledge of both Fragments and PageAdapters.

Pager Adapter

Android ViewPager is a layout manager that allows the user to flip left and right through pages of data. You supply an implementation of a PagerAdapter to generate the pages that the view shows.

The PagerAdapter providing the adapter to populate pages inside of a ViewPager.

It does not Required Fragment only use on xml layout file to attach in view pager.

It is limited (fixed) number of items (Fragments).

it never removes a fragment instance from FragmentManager.

When you implement a PagerAdapter, you must override the following methods at minimum:

instantiateItem(ViewGroup, int)

destroyItem(ViewGroup, int, Object)

getCount()

isViewFromObject(View, Object)

FragmentStatePagerAdapter

It is Required and implementation Fragments.

A FragmentStatePagerAdapter is more memory savvy.

It completely removes Fragment instances from the FragmentManager once they are out of reach.

The state of the removed Fragments is stored inside the FragmentStatePagerAdapter.

View Pager Example in Android

Add Librarry In build.gradle using app And Import Library

compile 'com.android.support:design:26.+'

ViewPagerActivity.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.bhaumik.officetask.ViewPagerActivity">


    <android.support.design.widget.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabGravity="fill"
        app:tabMode="fixed"
       app:tabBackground="@color/colorPrimaryDark"
        app:tabSelectedTextColor="#fff"/>

    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</LinearLayout>

Create Two Fragment First Fragment And Second Fragment Are Create in This Example.

FirstFragment.xml

<FrameLayout 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="com.example.bhaumik.officetask.fragments.FirstFragment"
    android:background="@android:color/holo_blue_dark">


    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:textSize="@dimen/_20dp"
        android:textColor="#fff"
        android:textStyle="bold"
        android:gravity="center"
        android:text="This is a First Fragment" />

</FrameLayout>

SecondFragment.xml

<FrameLayout 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="com.example.bhaumik.officetask.fragments.SecondFragment"
    android:background="@android:color/holo_green_dark">


    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:textSize="@dimen/_20dp"
        android:textColor="#fff"
        android:gravity="center"
        android:textStyle="bold"
        android:text="This is a Second Fragment" />

</FrameLayout>

FirstFragment.java

package com.example.bhaumik.officetask.fragments;


import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import com.example.bhaumik.officetask.R;

/**
 * A simple {@link Fragment} subclass.
 */
public class FirstFragment extends Fragment {


    public FirstFragment() {
        // Required empty public constructor
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_first, container, false);
    }

}

SecondFragment.java

package com.example.bhaumik.officetask.fragments;


import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import com.example.bhaumik.officetask.R;

/**
 * A simple {@link Fragment} subclass.
 */
public class SecondFragment extends Fragment {


    public SecondFragment() {
        // Required empty public constructor
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_second, container, false);
    }

}

ViewPagerActivity.java

package com.example.bhaumik.officetask;

import android.support.design.widget.TabLayout;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import com.example.bhaumik.officetask.adapter.ViewPagerAdapter;

public class ViewPagerActivity extends AppCompatActivity {


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_view_pager);

        ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);
        TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);

        tabLayout.setupWithViewPager(viewPager);

        viewPager.setAdapter(new ViewPagerAdapter(getSupportFragmentManager()));

    }
}

ViewPagerAdapter.java

package com.example.bhaumik.officetask.adapter;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;

import com.example.bhaumik.officetask.fragments.FirstFragment;
import com.example.bhaumik.officetask.fragments.SecondFragment;

/**
 * Created by Bhaumik on 8/28/2017.
 */

public class ViewPagerAdapter extends FragmentStatePagerAdapter{

    public ViewPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {

        switch (position){

            case 0 :
                return getFirstFragment();
            case 1 :
                return getSecondFragment();
        }
        return null;
    }

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


    private FirstFragment getFirstFragment() {

        FirstFragment firstFragment = new FirstFragment();
        Bundle bundle = new Bundle();
        firstFragment.setArguments(bundle);

        return firstFragment;

    }


    public SecondFragment getSecondFragment() {

        SecondFragment secondFragment = new SecondFragment();
        Bundle bundle = new Bundle();
        secondFragment.setArguments(bundle);

        return secondFragment;

    }

    @Override
    public CharSequence getPageTitle(int position) {

        switch (position){

            case 0 :
                return "First Fragment";

            case 1 :
                return "Second Fragment";
        }
        return "";
    }
}