Android viewpager2 tab layout with FragmentStateAdapter

Question

I am using ViewPager2 with Tab Layout. Here is my MainFragment code -

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)

    binding.viewPager.adapter = MyPagerAdapter(requireActivity())
    TabLayoutMediator(
        binding.tabLayout,  binding.viewPager
    ) { tab, position ->
        binding.viewPager.setCurrentItem(0, true)
        when (position) {
            0 -> tab.text = “Tab A”
            1 -> tab.text = “Tab B”      
        }
    }.attach()
}


private class MyPagerAdapter(fragmentActivity: FragmentActivity) :
    FragmentStateAdapter(fragmentActivity) {
    private val items = 2
    override fun getItemCount(): Int {
        return items
    }

    override fun createFragment(position: Int): Fragment = when (position) {
        0 -> FragmentA()
        1 -> FragmentB()
        else -> FragmentA()
    }
}

I have 2 questions here -

override fun createFragment(position: Int): Fragment creates new instance of child fragments every time the MainFragment view is created. Is there no way to re-use an already existing instance of child fragment?
In my Navigation graph, I have the MainFragment and its children FragmentA and FragmentB. Why cant I use the Navigation action to open children from its parent? If yes, override fun createFragment(position: Int): Fragment needs a Fragment to be returned and findNavController().navigate() does not return anything. How do I do this?

user_8206328 · Answer

you can follow this sample code, may this will help you

class TvShowsFragment : Fragment(R.layout.tvshows_fragment) {

private var _binding: TvshowsFragmentBinding? = null
private val binding get() = _binding!!

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)

    _binding = TvshowsFragmentBinding.bind(view)

    setUpViewPager()
    setHasOptionsMenu(true)
}

private fun setUpViewPager() {
    val viewPager = binding.vpTvShows
    val tab = binding.tlTvShows
    val adapterTv = TvAdapter(this)
    viewPager.adapter = adapterTv

    TabLayoutMediator(tab, viewPager) { tabText, position ->
        tabText.text = when (position) {
            0 -> getString(R.string.title_tvAiringToday)
            1 -> getString(R.string.title_tvOnTheAir)
            2 -> getString(R.string.title_popular)
            3 -> getString(R.string.title_topRated)
            else -> getString(R.string.title_tvAiringToday)

        }
    }.attach()

}

private inner class TvAdapter(fm: Fragment) : FragmentStateAdapter(fm) {

    override fun getItemCount(): Int = 4

    override fun createFragment(position: Int): Fragment {
        return when (position) {
            0 -> TvAiringTodayFragment()
            1 -> TvOnTheAirFragment()
            2 -> TvPopularFragment()
            3 -> TvTopRatedFragment()
            else -> TvAiringTodayFragment()
        }
    }

}

Android viewpager2 tab layout with FragmentStateAdapter

1 Answers