Onboarding Screen with ViewPager2

Step 1:

File open res/layout/activity_main.xml file −

<?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:id="@+id/main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Mainactivity Home"
        android:textColor="#09A495"
        android:textSize="40dp"
        android:textStyle="bold" />

</LinearLayout>

Step 2:

Creat Onboarding Activity  com.microappvalley.newtestproject/OnboardingActivity.java 

File open activity_onboarding.xml file −

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:id="@+id/main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".OnboardingActivity">

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <androidx.appcompat.widget.AppCompatButton
        android:id="@+id/Nextbtn"
        android:layout_width="wrap_content"
        android:layout_height="36dp"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:layout_margin="16dp"
        android:background="#009688"
        android:text="Next" />

    <androidx.appcompat.widget.AppCompatButton
        android:id="@+id/Startbtn"
        android:layout_width="wrap_content"
        android:layout_height="36dp"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:layout_margin="16dp"
        android:background="#009688"
        android:text="Start"
        android:visibility="gone" />

</RelativeLayout>

Step 3:

Create Onboarding Page res/layout/onboarding_page01.xml file −

<?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"
    android:orientation="vertical">

    <ImageView
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:src="@drawable/onboarding_img01" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:text="Welcome to App!"
        android:textColor="#009688"
        android:textSize="24sp"
        android:textStyle="bold" />

</LinearLayout>

Create Onboarding 2nd Page res/layout/onboarding_page02.xml file −

Create Onboarding 3rd Page res/layout/onboarding_page03.xml file −

Step 4:

File open com.microappvalley.newtestproject/MainActivity.java file −

package com.example.onboardingscreen3;

import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {

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

    }
}

Step 5:

Create Onboarding Adapter com.microappvalley.newtestproject/OnboardingAdapter file −

package com.example.onboardingscreen3;

import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;
import java.util.ArrayList;

public class OnboardingAdapter extends RecyclerView.Adapter<OnboardingAdapter.ViewHolder> {

    private ArrayList<Integer> arrayList;

    public OnboardingAdapter(ArrayList<Integer> arrayList) {

        this.arrayList = arrayList;
    }

    @NonNull
    @Override
    public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        LayoutInflater inflater = LayoutInflater.from(parent.getContext());
        View view = inflater.inflate(arrayList.get(viewType), parent, false);
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
    }

    @Override
    public int getItemCount() {

        return arrayList.size();
    }

    @Override
    public int getItemViewType(int position) {

        return position;
    }

    public static class ViewHolder extends RecyclerView.ViewHolder {
        public ViewHolder(@NonNull View itemView) {

            super(itemView);
        }
    }
}

Step 6:

File open com.microappvalley.newtestproject/OnboardingActivity file −

package com.example.onboardingscreen3;

import android.annotation.SuppressLint;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import androidx.appcompat.app.AppCompatActivity;
import androidx.appcompat.widget.AppCompatButton;
import androidx.viewpager2.widget.ViewPager2;
import java.util.ArrayList;


public class OnboardingActivity extends AppCompatActivity {

    private ViewPager2 viewPager;
    private OnboardingAdapter onboardingAdapter;
    private AppCompatButton Nextbtn, Startbtn;
    private ArrayList<Integer> arrayList;

    @SuppressLint("MissingInflatedId")
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_onboarding);

        viewPager = findViewById(R.id.viewPager);
        Nextbtn = findViewById(R.id.Nextbtn);
        Startbtn = findViewById(R.id.Startbtn);

        arrayList = new ArrayList<>();
        arrayList.add(R.layout.onboarding_page01);
        arrayList.add(R.layout.onboarding_page02);
        arrayList.add(R.layout.onboarding_page03);

        onboardingAdapter = new OnboardingAdapter(arrayList);
        viewPager.setAdapter(onboardingAdapter);

        // Next button
        Nextbtn.setOnClickListener(v -> {
            int currentItem = viewPager.getCurrentItem();
            if (currentItem < arrayList.size() - 1) {
                viewPager.setCurrentItem(currentItem + 1);
            }
        });

        // Start button
        Startbtn.setOnClickListener(v -> {
            Intent intent = new Intent(OnboardingActivity.this, MainActivity.class);
            startActivity(intent);
            finish();
        });


        viewPager.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {
            @Override
            public void onPageSelected(int position) {
                super.onPageSelected(position);

                if (position == arrayList.size() - 1) {
                    Nextbtn.setVisibility(View.GONE);
                    Startbtn.setVisibility(View.VISIBLE);
                } else {
                    Nextbtn.setVisibility(View.VISIBLE);
                    Startbtn.setVisibility(View.GONE);
                }
            }
        });
    }
}

Step 7:

 Open AndroidManifeist app/mamifests/AndroidManifeist.xml file −

<activity
    android:name=".MainActivity"
    android:exported="false" />
<activity
    android:name=".OnboardingActivity"
    android:exported="true">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />

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

 Open Device Manager, run the emulator, and  then run the application. Next, check the working output and check the output  you declared in your code.

Output: