viewpager with fragments example in android studio

 viewpager with fragments example in android studio

In this Article today learn view pager with fragments example in android. android fragment one activity open to many pages. follow the full Source code view pager with fragments example in android.

1. MainActivity.java:

package com.insta.story.fragment.viewpager;

import android.app.Activity;

import android.os.Bundle;

import android.view.Menu;

import android.view.MenuItem;

import androidx.viewpager.widget.ViewPager;

import com.google.android.gms.ads.AdRequest;

import com.google.android.gms.ads.AdView;

import com.google.android.gms.ads.MobileAds;

public class MainActivity extends Activity {

    private AdView mAdView;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        MobileAds.initialize(this, (getString(R.string.ad_id)));

        mAdView = findViewById(R.id.adView);

        AdRequest adRequest = new AdRequest.Builder().build();

        mAdView.loadAd(adRequest);

        ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);

        viewPager.setAdapter(new CustomPagerAdapter(this));

    }

}

2.CustomPagerAdapter.java:

package com.insta.story.fragment.viewpager;

import android.content.Context;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import androidx.viewpager.widget.PagerAdapter;

public class CustomPagerAdapter extends PagerAdapter {

    private Context mContext;

    public CustomPagerAdapter(Context context) {

        mContext = context;

    }

    @Override

    public Object instantiateItem(ViewGroup collection, int position) {

        ModelObject modelObject = ModelObject.values()[position];

        LayoutInflater inflater = LayoutInflater.from(mContext);

        ViewGroup layout = (ViewGroup) inflater.inflate(modelObject.getLayoutResId(), collection, false);

        collection.addView(layout);

        return layout;

    }

    @Override

    public void destroyItem(ViewGroup collection, int position, Object view) {

        collection.removeView((View) view);

    }

    @Override

    public int getCount() {

        return ModelObject.values().length;

    }

    @Override

    public boolean isViewFromObject(View view, Object object) {

        return view == object;

    }

    @Override

    public CharSequence getPageTitle(int position) {

        ModelObject customPagerEnum = ModelObject.values()[position];

        return mContext.getString(customPagerEnum.getTitleResId());

    }

}

3.ModelObject.java:

package com.insta.story.fragment.viewpager;

public enum ModelObject {

    RED(R.string.red, R.layout.view_red),

    BLUE(R.string.blue, R.layout.view_blue),

    GREEN(R.string.green, R.layout.view_green);

    private int mTitleResId;

    private int mLayoutResId;

    ModelObject(int titleResId, int layoutResId) {

        mTitleResId = titleResId;

        mLayoutResId = layoutResId;

    }

    public int getTitleResId() {

        return mTitleResId;

    }

    public int getLayoutResId() {

        return mLayoutResId;

    }

}

4.activity_main.xml:

<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=".MainActivity">

    <androidx.viewpager.widget.ViewPager

        android:id="@+id/viewpager"

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        />

    <com.google.android.gms.ads.AdView

        xmlns:ads="http://schemas.android.com/apk/res-auto"

        android:id="@+id/adView"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_centerHorizontal="true"

        android:layout_alignParentBottom="true"

        ads:adSize="BANNER"

        ads:adUnitId="ca-app-pub-3940256099942544/6300978111">

    </com.google.android.gms.ads.AdView>

</RelativeLayout>

5.view_blue.xml:

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical" android:layout_width="match_parent"

    android:background="@android:color/holo_blue_dark"

    android:layout_height="match_parent">

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="Second View"

        android:layout_gravity="center_horizontal"

        android:textSize="28sp"

        android:textColor="@android:color/black"

        android:textStyle="bold"

        android:layout_centerVertical="true"

        android:layout_centerHorizontal="true"

        android:id="@+id/textView" />

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="Swipe left to\nFirst View"

        android:layout_gravity="center_horizontal"

        android:textSize="20sp"

        android:textColor="@android:color/black"

        android:textStyle="bold"

        android:minLines="2"

        android:id="@+id/textView2"

        android:padding="@dimen/activity_horizontal_margin"

        android:layout_alignParentBottom="true"

        android:layout_alignParentLeft="true"

        android:layout_alignParentStart="true" />

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="Swipe right to\nThird View"

        android:layout_gravity="center_horizontal"

        android:textSize="20sp"

        android:textColor="@android:color/black"

        android:textStyle="bold"

        android:padding="@dimen/activity_horizontal_margin"

        android:minLines="2"

        android:id="@+id/textView3"

        android:layout_alignTop="@+id/textView2"

        android:layout_alignParentRight="true"

        android:layout_alignParentEnd="true" />

</RelativeLayout>

6.view_green.xml:

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical" android:layout_width="match_parent"

    android:background="@android:color/holo_green_dark"

    android:layout_height="match_parent">

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="Third View"

        android:layout_gravity="center_horizontal"

        android:textSize="28sp"

        android:textColor="@android:color/black"

        android:textStyle="bold"

        android:layout_centerVertical="true"

        android:layout_centerHorizontal="true"

        android:id="@+id/textView" />

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="Swipe left to\nSecond View"

        android:layout_gravity="center_horizontal"

        android:textSize="20sp"

        android:textColor="@android:color/black"

        android:textStyle="bold"

        android:minLines="2"

        android:id="@+id/textView2"

        android:padding="@dimen/activity_horizontal_margin"

        android:layout_alignParentBottom="true"

        android:layout_alignParentLeft="true"

        android:layout_alignParentStart="true" />

</RelativeLayout>

7.view_red.xml:

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical" android:layout_width="match_parent"

    android:background="@android:color/holo_red_dark"

    android:layout_height="match_parent">

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="First View"

        android:layout_gravity="center_horizontal"

        android:textSize="28sp"

        android:textColor="@android:color/black"

        android:textStyle="bold"

        android:layout_centerVertical="true"

        android:layout_centerHorizontal="true"

        android:id="@+id/textView" />

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="Swipe right to\nSecond View"

        android:layout_gravity="center_horizontal"

        android:textSize="20sp"

        android:textColor="@android:color/black"

        android:textStyle="bold"

        android:minLines="2"

        android:id="@+id/textView3"

        android:padding="@dimen/activity_horizontal_margin"

        android:layout_alignParentBottom="true"

        android:layout_alignParentRight="true"

        android:layout_alignParentEnd="true" />

</RelativeLayout>

8.dimens.xml:

<resources>

    <!-- Default screen margins, per the Android Design guidelines. -->

    <dimen name="activity_horizontal_margin">16dp</dimen>

    <dimen name="activity_vertical_margin">16dp</dimen>

</resources>

9.colors.xml:

<?xml version="1.0" encoding="utf-8"?>

<resources>

    <color name="purple_200">#FFBB86FC</color>

    <color name="purple_500">#FF6200EE</color>

    <color name="purple_700">#FF3700B3</color>

    <color name="teal_200">#FF03DAC5</color>

    <color name="teal_700">#FF018786</color>

    <color name="black">#FF000000</color>

    <color name="white">#FFFFFFFF</color>

</resources>

10.AndroidManifest.xml:

<?xml version="1.0" encoding="utf-8"?>

<manifest xmlns:android="http://schemas.android.com/apk/res/android"

    package="com.insta.story.fragment.viewpager">

<uses-permission android:name="android.permission.INTERNET"/>

    <application

        android:allowBackup="true"

        android:icon="@mipmap/ic_launcher"

        android:label="@string/app_name"

        android:roundIcon="@mipmap/ic_launcher_round"

        android:supportsRtl="true"

        android:theme="@style/Theme.Viewpager">

        <activity android:name=".MainActivity">

            <intent-filter>

                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />

            </intent-filter>

        </activity>

    </application>

    <meta-data

        android:name="com.google.android.gms.ads.APPLICATION_ID"

        android:value="@string/ad_id" />

</manifest>