Android Tutorial

Software Setup and Configuration

Android Studio

File Structure

Components

Core Topics

Layout

View

Button

Intent and Intent Filters

Toast

RecyclerView

Fragments

Adapters

Other UI Component

Image Loading Libraries

Date and Time

Material Design

Bars

Working with Google Maps

Chart

Animation

Database

Advance Android

Jetpack

Architecture

App Publish

App Monetization

ViewPager Using Fragments in Android with Example

Using a ViewPager with Fragments in Android allows you to swipe between different screens (pages). Here's how you can set up a simple ViewPager that uses Fragments:

1. Setup:

Add the required dependencies for ViewPager2 and Fragments to your app-level build.gradle:

implementation 'androidx.viewpager2:viewpager2:1.0.0'  // Make sure to check for the latest version
implementation 'androidx.fragment:fragment-ktx:1.3.4'  // Again, check for the latest version

2. Create your fragments:

Let's assume you have two fragments: FirstFragment and SecondFragment.

3. Create a FragmentStateAdapter:

import androidx.fragment.app.Fragment
import androidx.viewpager2.adapter.FragmentStateAdapter

class ViewPagerAdapter(fragment: Fragment) : FragmentStateAdapter(fragment) {
    
    override fun getItemCount(): Int = 2

    override fun createFragment(position: Int): Fragment {
        return when (position) {
            0 -> FirstFragment()
            1 -> SecondFragment()
            else -> throw IllegalStateException("Invalid position $position")
        }
    }
}

4. Set up the ViewPager in your Activity or Parent Fragment:

First, in the layout XML (activity_main.xml for example):

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

Then, in your MainActivity.kt or a parent fragment:

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

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val viewPager: ViewPager2 = findViewById(R.id.viewPager)
        viewPager.adapter = ViewPagerAdapter(this)
    }
}

If you're setting this up inside a fragment, replace this with this@YourFragmentName when initializing the ViewPagerAdapter.

5. (Optional) Integrate with TabLayout:

If you want to show tabs with your ViewPager, you can integrate it with TabLayout from the Material Components library.

First, add the dependency:

implementation 'com.google.android.material:material:1.4.0'  // Check for the latest version

Then, in your layout XML:

<com.google.android.material.tabs.TabLayout
    android:id="@+id/tabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

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

Finally, in your MainActivity.kt or parent fragment, after setting the adapter:

import com.google.android.material.tabs.TabLayoutMediator

// ...

val tabLayout: TabLayout = findViewById(R.id.tabLayout)
TabLayoutMediator(tabLayout, viewPager) { tab, position ->
    tab.text = when (position) {
        0 -> "First Tab"
        1 -> "Second Tab"
        else -> throw IllegalStateException("Invalid position $position")
    }
}.attach()

Now you have a ViewPager using Fragments in Android with an example setup! Adjust as needed to fit the requirements of your app.

Implementing ViewPager with FragmentPagerAdapter in Android:

Description: Demonstrates the basic implementation of a ViewPager using FragmentPagerAdapter in Android.

Code:

// In your Activity
ViewPager viewPager = findViewById(R.id.viewPager);
FragmentPagerAdapter adapter = new YourFragmentPagerAdapter(getSupportFragmentManager());
viewPager.setAdapter(adapter);

Using ViewPager2 with Fragments in Android:

Description: Introduces ViewPager2, the updated version, with Fragments in Android.

Code:

// In your Activity
ViewPager2 viewPager2 = findViewById(R.id.viewPager2);
FragmentStateAdapter adapter = new YourFragmentStateAdapter(this);
viewPager2.setAdapter(adapter);

ViewPager and TabLayout with Fragments example:

Description: Integrates ViewPager with TabLayout for a tabbed UI experience using Fragments in Android.

Code:

// In your Activity
ViewPager viewPager = findViewById(R.id.viewPager);
TabLayout tabLayout = findViewById(R.id.tabLayout);
FragmentPagerAdapter adapter = new YourFragmentPagerAdapter(getSupportFragmentManager());
viewPager.setAdapter(adapter);
tabLayout.setupWithViewPager(viewPager);