# 4.5 Fragment Slide Shows

A common way to use a fragment is with a ViewPager, which is a container that allows swapping of fragments without changing the entire screen. We’ll be creating a simplified version of the menu view in Eatery:

1\. We will first create the classes for our two fragments: *LunchFragment* and *DinnerFragment*. &#x20;

{% code title="LunchFragment.kt" %}

```kotlin
class LunchFragment: Fragment() {
  companion object {
    fun newInstance(): LunchFragment {
      return LunchFragment()
    }
  }
  override fun onCreateView(inflater: LayoutInflater, 
                            container: ViewGroup?, 
                            savedInstanceState: Bundle?): View? {
    return inflater.inflate(R.layout.fragment_layout, container, false)
  }
}
```

{% endcode %}

{% code title="DinnerFragment.kt" %}

```kotlin
class DinnerFragment: Fragment() {
  companion object {
    fun newInstance(): DinnerFragment {
      return DinnerFragment()
    }
  }
  override fun onCreateView(inflater: LayoutInflater, 
                            container: ViewGroup?, 
                            savedInstanceState: Bundle?): View? {
    return inflater.inflate(R.layout.fragment_layout, container, false)
  }
}
```

{% endcode %}

Because a fragment inherits a different parent than an activity, if we want to use activity-specific methods like `findViewById()`, we'll need access to the root view. We can easily modify the code inside the `onCreateView()` method.

{% code title="DinnerFragment.kt" %}

```kotlin
override fun onCreateView(inflater: LayoutInflater, 
                          container: ViewGroup?, 
                          savedInstanceState: Bundle?): View? {
    ...
    val rootView: View = 
        inflater.inflate(R.layout.fragment_layout, container, false)
    
    // use activity-specific methods
    val tv = rootView.findViewById<TextView>(R.id.textview)
    return rootView
}
```

{% endcode %}

2\. We create a view pager adapter class to manage the changing of fragments. As we can see in the code, each page in the view pager is associated with a fragment.

{% code title="ViewPagerAdapter.kt" %}

```kotlin
class ViewPagerAdapter(fa: FragmentActivity) : FragmentStateAdapter(fa) {
    override fun getItemCount(): Int = NUM_PAGES
    
    override fun createFragment(position: Int): Fragment {
        return when (position) {
            0 -> LunchFragment()
            1 -> DinnerFragment()
            else -> throw Exception()
        }
    }
}
```

{% endcode %}

3\. We add the view pager adapter to our activity.&#x20;

{% code title="MainActivity.kt" %}

```kotlin
class MainActivity : AppCompatActivity() {

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

    val viewPager = findViewById(R.id.view_pager)

    val pagerAdapter = ViewPagerAdapter(this)
    viewPager.adapter = pagerAdapter
  }
}
```

{% endcode %}

The XML to our activity may look something like this, where there is a container for holding the view pager.&#x20;

{% code title="main\_activity.xml" %}

```markup
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout   
  ... >
  <androidx.viewpager2.widget.ViewPager2
    android:id="@+id/view_pager"
    ... />
</LinearLayout>
```

{% endcode %}

As you can see, setting up a view pager doesn't take too many steps and there is not too much boilerplate code. View pagers are versatile and appear in many mobile designs. We even used a view pager in Eatery! The launch screen of Eatery currently has a view pager with three pages and each of those pages is associated with a fragment.

{% hint style="warning" %}
A unique property of ViewPagers is that it preloads a certain number of pages to the left and right of your currentPage when the adapter is first created in the flow of your app which makes it hard to dynamically respond to changes!

If you are modifying other fragments in your ViewPager or trying to share data in between using techniques from [4.4 Sharing Data Between Fragments](/archive/archived-native-android-textbook-pages/5.-fragments/5.5-sharing-data-between-fragments.md) or find that none of the views in your fragments are being updated, you MUST call on [notifyItemChanged](https://developer.android.com/reference/androidx/recyclerview/widget/RecyclerView.Adapter#notifyItemChanged\(int\)) after to refresh the stale data in your fragment from when it was preloaded. NotifyItemChanged takes in the index of the Fragment being refreshed.&#x20;

ex: viewPager2.adapter.notifyItemChanged(0) refreshes the first fragment in your ViewPager
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://android-course.cornellappdev.com/archive/archived-native-android-textbook-pages/5.-fragments/5.4-implementation-with-fragments.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
