Tablayout with viewpager2 showing two times inside bottom tabs navigation

enter image description hereI am creating an app with bottom tabs navigation. Activity contains a view pager and the first fragment will have another view pager2. Like nested viewpager2. When compiled the tablayout is getting displayed twice on the toolbar. Please help me.

Here is my code:

Fragment_home:

<?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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="@color/white"
    tools:context=".MainActivity">

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tabLayoutHome"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/orange"
        app:tabIconTint="@color/grey"
        app:tabIndicatorColor="@color/white"
        app:tabSelectedTextColor="@color/white"
        app:tabTextColor="@color/grey" />

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/viewPagerhome"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />
</LinearLayout>

Adapter:

private class ViewPagerFragmentAdapter extends FragmentStateAdapter {

    public ViewPagerFragmentAdapter(@NonNull FragmentActivity fragmentActivity) {
        super(fragmentActivity);
    }
    @NonNull
    @Override
    public Fragment createFragment(int position) {
        switch (position) {
            case 0:
                return new TLTabFragment();
            case 1:
                return new SocialTabFragment();
        }
        return new TerralogicTabFragment();
    }
    @Override
    public int getItemCount() {
        return labels.length;
    }
}    

HomeFragment:

public class HomeFragment extends Fragment {
    private ViewPager2 viewPager;
    private TabLayout tabLayout;
    ViewPagerFragmentAdapter adapter;
    // array for tab labels
    private final String\[\] labels = new String\[\]{"TL", "Social"};
    public View onCreateView(@NonNull LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

        View view = inflater.inflate(R.layout.fragment_home,container,false);
        viewPager = view.findViewById(R.id.viewPagerhome);
        tabLayout = view.findViewById(R.id.tabLayoutHome);
        viewPager.setCurrentItem(0, false);
        init();
        return view;
    }

    private void init() {
        adapter = new ViewPagerFragmentAdapter(requireActivity());
        viewPager.setAdapter(adapter);
        new TabLayoutMediator(tabLayout, viewPager, (tab, position) -> {
            tab.setText(labels\[position\]);
        }).attach();
    }

    @Override
    public void onDestroyView() {
        super.onDestroyView();
    }
}

TLTabFragment

public class TLTabFragment extends Fragment {

    public TLTabFragment() {}

    public static TLTabFragment newInstance() {return new TLTabFragment();}

    @Override
    public void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);}

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

        View view= inflater.inflate(R.layout.fragment_tl_tab, container, false);

        return view;
    }
}

Upvotes: 3

Views: 110

Answers (0)

Related Questions