Material Component TabLayout inside Fragment in Kotlin

Question

I'm developing an app using Kotlin and Material Components (https://material.io/develop/android). I'm trying to use TabLayout (https://material.io/develop/android/components/tab-layout) inside a Fragment, and I want to open fragments using this TabLayout.

In my activity, I have a Bottom Navigation. This Bottom Navigation opens a fragment, and inside this fragment is my TabLayout, and a ViewPager. I want to open a fragment inside this ViewPager (or maybe I can replace this ViewPager to a ContentFrameLayout or similar).

So, the order is: Activity -> Fragment (by Bottom Navigation) -> Fragment (by TabLayout)

How can I do this?

Answer 1

You have to use childFragmentManager to add second layer of fragments(fragment inside fragment).

Inside Activity on Bottom navigation click, you can add the fragment with Tablayout using fragment manager.

supportFragmentManager.beginTransaction().replace(R.id.fragment_container,YourFragmentWithTablayot)

to add second level of fragment on Tablayout - viewpager, set viewPagerAdapter with ChildFragmentManger.

ViewPagerAdapter adapter = new ViewPagerAdapter(getChildFragmentManager());
viewPager.setAdapter(adapter);

ViewPagerAdapter is your custom adapter class which extends FragmentAdapter.

//example adapter code

    public class ViewPagerAdapter extends FragmentPagerAdapter {


    public ViewPagerAdapter(FragmentManager fm) {


        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        return null;
    }

    @Override
    public int getCount() {
        return 0;
    }
}