замена фрагментов вызывает проблему перекрытия с одиночной разметкой кадра

Question

Я хочу сделать приложение со всеми тремя комбинациями BottomNavigation, NavigationDrawer и TabLayout.BottomNavigation имеет три кнопки, каждая кнопка имеет отдельный фрагмент.NavigationDrawer имеет 4 пункта меню, каждый из которых имеет отдельные фрагменты.Точно так же TabLayout имеет PageViewer с 3 вкладками, каждая вкладка имеет отдельный фрагмент.

У меня есть требования к дизайну, но существует проблема перекрытия всех фрагментов всех вышеупомянутых 3 элементов управления.И я не мог выполнять такие действия, как нажатие кнопок.Если я нажму на метод действия кнопки, используя событие OnClick, элемент управления не перейдет к методу действия, связанному с этой кнопкой.Кроме того, элементы управления на каждом фрагменте перекрываются с другими элементами управления фрагментом и также видны.

Я использую только одну разметку кадра для BottomNavigation и NavigationDrawer для изменения фрагментов.Как решить проблему перекрытия между фрагментами.

 <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent”
        android:layout_height="match_parent">
        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

             <android.support.v7.widget.Toolbar
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

      <android.support.design.widget.TabLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent/>
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
           android:layout_width="match_parent"
            android:layout_height="match_paren/>
     <android.support.design.widget.BottomNavigationView/>

    <FrameLayout
            android:id="@+id/frameLayout"
            android:layout_width="match_parent"
            android:layout_height="407dp/>
    <android.support.v4.widget.DrawerLayout
           android:layout_width="match_parent"
            android:layout_height="match_parent"
            tools:openDrawer="start">
    <android.support.design.widget.NavigationView
                 android:layout_width="wrap_content"
                android:layout_height="match_parent/>
        </android.support.v4.widget.DrawerLayout>
    </android.support.constraint.ConstraintLayout>

Java-код для BottomNavigation, NavigationDrawer и TabLayout.

// MainActivity.Java

// изменение фрагмента с помощьюframelayout для фрагментов NavigationDrawer

frameLayout = findViewById(R.id.frameLayout);
 getSupportActionBar().setDisplayHomeAsUpEnabled(true);
 navDrawer = (NavigationView) findViewById(R.id.nav_view);
        nnavDrawer.setNavigationItemSelectedListener(new 
 NavigationView.OnNavigationItemSelectedListener() {
 @Override
 public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
                switch (menuItem.getItemId()){
                    case R.id.navevents:
                        setFragment(events);
                       return true;
                    case R.id.navnews:
                        setFragment(news);
                        dl.closeDrawer(GravityCompat.START);
                        return true;
                }
                return false;
            }
        });

//fragment changing with framelayout  for BottomNavigation fragments
 bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
 public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
                switch (menuItem.getItemId()){
                    case R.id.navhome:
                        setFragment(Json);
                        return true;
                    case R.id.navdetails:
                        setFragment(details);
                        return true;
              }
                return false;
            }
        });
    }

Аналогично изменяются 3 фрагмента с пейджером представления для TabLayout.Но все фрагменты используют одну и ту же структуру кадра.

 //fragments are changing with replace() method. 
  private void setFragment(Fragment fragment) {
        FragmentTransaction fragmentChanges = 
        getSupportFragmentManager().beginTransaction();
        fragmentChanges.replace(R.id.frameLayout,fragment);
        fragmentChanges.addToBackStack(null);
       fragmentChanges.commit();
    }

Я видел много других сообщений о проблеме перекрытия фрагментов.некоторые из них предложили удалить все фрагменты и добавить фрагмент, который должен отображаться.Я пробовал как в приведенном ниже коде.Но это не сработало.

private void changeFragment(Fragment fr){
    FrameLayout fl = (FrameLayout) findViewById(R.id.mainframe);
    fl.removeAllViews();
    FragmentTransaction transaction1 = 
    getSupportFragmentManager().beginTransaction();
    transaction1.add(R.id.mainframe, fr);
   transaction1.commit();
}

Не могу ли я использовать один макет кадра для BottomNavigation, NavigationDrawer и TabLayout?Может кто-нибудь подсказать мне, как решить эту проблему.