مشکل نمایش viewpager تب لایوت در BottomNavigtion

سلام ، وقت همگی بخیر

یک مشکل برام پیش اومده ، داخل Bottom Navigation و  فرگمنت هوم(صفحه اصلی), یک TabLayout قرار دادم و از ViewPager هم جهت سوییچ بین صفحات تب استفاده کردم ، اما وقتی پروژه رو اجرا میکنم ، به مشکل زیر برخورد میکنم

ممنون میشم لطف کنید پاسخ بدید...

Error: http://s6.picofile.com/file/8379977150/Error.gif

MainActivity.java:

http://s6.picofile.com/file/8379981200/MainActivity.png | http://s6.picofile.com/file/8379981268/MainActivity_2.png

activity_main.xml:

http://s7.picofile.com/file/8379981292/activity_main.png | http://s7.picofile.com/file/8379981318/activity_main_2.png

HomeFragment.java:

public class HomeFragment extends Fragment {
TabLayout tabLayout;
ViewPager viewPager;
ViewPagerAdapter viewPagerAdapter;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.fragment_home, container, false);
    setupTabLayout(view);
    return view;
}


public void setupTabLayout(View view) {
    tabLayout = view.findViewById(R.id.tabLayout);
    viewPager = view.findViewById(R.id.viewPager);
    viewPagerAdapter = new ViewPagerAdapter(getFragmentManager(), 1);
    viewPagerAdapter.addItem(new TestOneFragment() , "Test 1");
    viewPagerAdapter.addItem(new TestTwoFragment() , "Test 2");
    viewPagerAdapter.addItem(new TestThreeFragment() , "Test 3");
    viewPager.setAdapter(viewPagerAdapter);
    tabLayout.setupWithViewPager(viewPager);

}

}

fragment_home.xml:

http://s6.picofile.com/file/8379981326/fragement_home.png | http://s7.picofile.com/file/8379981350/fragement_home_2.png

ViewPagerAdapter.java:

http://s7.picofile.com/file/8379981376/ViewPagerAdapter.png