Fragments overlapping with DrawerLayout / NavigationView

Question

Using DrawerLayout with NavigationView and a FrameLayout , I want to switch Fragment s. This works great. However, if I switch too fast, the Fragment overlaps ...

This is similar to executePendingTransactions() does not work.

 <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/drawerLayout" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <include layout="@layout/toolbar" /> <FrameLayout android:id="@+id/frameLayout" android:layout_width="match_parent" android:layout_height="match_parent" /> </LinearLayout> <android.support.design.widget.NavigationView android:id="@+id/navigationView" android:layout_width="@240dp" android:layout_height="match_parent" android:layout_gravity="start" android:choiceMode="singleChoice" android:divider="@color/transparent" android:dividerHeight="0dp" app:menu="@menu/navigationdrawer" /> </android.support.v4.widget.DrawerLayout> 

If I switch the Fragment (too) quickly (manually or with a 750 ms delay code on my Nexus 5), I get both Fragment overlap and the second Fragment have a touch of pressing BUT the first Fragment is on top ...

The first Fragment contains ImageView and TextView s. The second Fragment contains a TabLayout and a ViewPager (if this may have anything with my problem). Yes, I use the AppCompat 22.2.0 and Design 22.2.0 libraries.

If I set the background color for both, then I can only see the first Fragment , and it never changes.

I tried popBackStackImmediate() , executePendingTransactions() , remove(fragment) , android:fitsSystemWindows="true" , Android: fragments that cover the problem , delays and other things, without success.

 @Override protected void onCreate(final Bundle savedInstanceState) { super.onCreate(savedInstanceState); // ... mNavigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(final MenuItem menuItem) { navigationDrawer(menuItem.getItemId()); return true; } }); if (savedInstanceState == null) { final MenuItem menuItem = mNavigationView.getMenu().getItem(0); if (menuItem != null) { navigationDrawer(menuItem.getItemId()); } } } private void navigationDrawer(final int itemId) { final Fragment fragment = getFragment(itemId); getSupportFragmentManager().beginTrasaction() .replace(R.id.frameLayout, fragment) .addToBackStack(null) .commit(); mNavigationView.getMenu().findItem(itemId).setChecked(true); mDrawerLayout.closeDrawer(mNavigationView); supportInvalidateOptionsMenu(); } @Override public boolean onOptionsItemSelected(final MenuItem item) { switch (item.getItemId()) { case R.id.menu_first: case R.id.menu_second: case R.id.menu_third: navigationDrawer(item.getItemId()); return true; } return super.onOptionsItemSelected(item); } 

EDIT

In my onCreate() I did this:

 if (savedInstanceState == null) { final MenuItem menuItem = mNavigationView.getMenu().getItem(0); if (menuItem != null) { navigationDrawer(menuItem.getItemId()); } } 

Which turns out to be too fast. Removing this code solved my problem (temporarily, see below).

I still don’t know why executePendingTransactions() didn’t prevent such a strange problem ...

EDIT 2

I was thinking about saving boolean (init to false) to keep track of the Fragment transaction. I set it to true in my navigationDrawer() and false in Fragment.onResume() . Still no ...

So: there is still a problem with my MainFragment , which loads the image using Picasso and switches too fast (800 ms) to another Fragment : they still overlap ...

Answer 1

In my onCreate() I did this:

  if (savedInstanceState == null) { final MenuItem menuItem = mNavigationView.getMenu().getItem(0); if (menuItem != null) { navigationDrawer(menuItem.getItemId()); } } 

Which turns out to be too fast. Removing this code solved my problem.

I still don't know:

why executePendingTransactions() didn’t prevent such a strange problem ...

EDIT

I have a problem with MainFragment that loads an image using Picasso and switches too fast (800 ms) to another: they still overlap ...

EDIT 2

So now I use a boolean to mark if my Activity translates Fragment or not, with a minimum timer in seconds between switches.

In my Fragment onViewCreated() :

 if (view != null) { view.post(new Runnable() { @Override public void run() { // Activity might be null getActivity().setTransitioning(false); } }); } 

And in my navigationDrawer() :

 if (isTransitioning()) { // Switching Fragments too fast return false; } 

Answer 2

You can try this ... This will delay your frequent click ...

 private final Handler mDrawerActionHandler = new Handler(); private static final long DRAWER_CLOSE_DELAY_MS = 250; mDrawerActionHandler.postDelayed(new Runnable() { @Override public void run() { // your navigation code goes here } }, DRAWER_CLOSE_DELAY_MS);