Stuttering When Opening New Fragment from Navigation Drawer

android, android-fragments, navigation-drawer

Solution

Your fragment is likely doing a lot of work in onCreate().

But, in general, you should use delayed runnable with a ~250ms holdoff before launching the fragment, to allow the drawer time to close.

        // launch the target Activity after a short delay, to allow the close animation to play
    mHandler.postDelayed(new Runnable() {
        @Override
        public void run() {
            goToNavDrawerItem(itemId);
        }
    }, NAVDRAWER_LAUNCH_DELAY);

    mDrawerLayout.closeDrawer(Gravity.START);

You can find the example in more detail in the Google IO app code on Github: Google IO 2014 code

Problem

My app uses a navigation drawer and loads a new fragment into my activity when a row is selected from the drawer. It works ok but there is substantial lag and stuttering on the drawer closing animation. What can I do to eliminate the lag? ``` public class MainActivity extends BaseActivity { private DrawerLayout mDrawerLayout; private ListView mDrawerList; private ActionBarDrawerToggle mDrawerToggle; public static MenuItem menuItem; public static MenuItem marketListItem; public static MenuItem mapItem; // nav drawer title private CharSequence mDrawerTitle; // used to store app title private CharSequence mTitle; // slide menu items private String[] navMenuTitles; private TypedArray navMenuIcons; private ArrayList<NavDrawerItem> navDrawerItems; private NavDrawerListAdapter adapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ActionBar bar = getActionBar(); bar.setBackgroundDrawable(new ColorDrawable(Color.parseColor("#0E4D8B"))); mTitle = mDrawerTitle = getTitle(); // load slide menu items navMenuTitles = getResources().getStringArray(R.array.nav_drawer_items); // nav drawer icons from resources navMenuIcons = getResources().obtainTypedArray(R.array.nav_drawer_icons); mDrawerLayout = (DrawerLayout)findViewById(R.id.drawer_layout); mDrawerList = (ListView)findViewById(R.id.list_slidermenu); navDrawerItems = new ArrayList<NavDrawerItem>(); // adding nav drawer items to array navDrawerItems.add(new NavDrawerItem(navMenuTitles[0], navMenuIcons.getResourceId(0, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[1], navMenuIcons.getResourceId(1, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[2], navMenuIcons.getResourceId(2, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[3], navMenuIcons.getResourceId(3, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[4], navMenuIcons.getResourceId(4, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[5], navMenuIcons.getResourceId(5, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[6], navMenuIcons.getResourceId(6, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[7], navMenuIcons.getResourceId(7, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[8], navMenuIcons.getResourceId(8, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[9], navMenuIcons.getResourceId(9, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[10], navMenuIcons.getResourceId(10, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[11], navMenuIcons.getResourceId(11, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[12], navMenuIcons.getResourceId(12, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[13], navMenuIcons.getResourceId(13, -1))); navDrawerItems.add(new NavDrawerItem(navMenuTitles[14], navMenuIcons.getResourceId(14, -1))); // recycle the typed array navMenuIcons.recycle(); // setting the nav drawer list adapter adapter = new NavDrawerListAdapter(getApplicationContext(), navDrawerItems); mDrawerList.setAdapter(adapter); // enabling action bar app icon and set it as toggle button getActionBar().setDisplayHomeAsUpEnabled(true); getActionBar().setHomeButtonEnabled(true); mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.drawable.ic_drawer, R.string.app_name, R.string.app_name) { public void onDrawerClosed(View view) { getActionBar().setTitle(mTitle); // calling onPrepareOptionsMenu() to show action bar icons invalidateOptionsMenu(); } public void onDrawerOpened(View drawerView) { getActionBar().setTitle(mDrawerTitle); // calling onPrepareOptionsMenu() to hide action bar icons invalidateOptionsMenu(); } }; mDrawerLayout.setDrawerListener(mDrawerToggle); if(savedInstanceState == null) { // on first time display view for first nav item displayView(0); } mDrawerList.setOnItemClickListener(new SlideMenuClickListener()); } /** * Slide menu item click listener */ private class SlideMenuClickListener implements ListView.OnItemClickListener { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { // display view for selected nav drawer item displayView(position); } } /** * Displaying fragment view for selected nav drawer list item */ private void displayView(int position) { // update the main content by replacing fragments Fragment fragment = null; switch (position) { case 0: // Action Alerts fragment = new ActionAlertsFragment(); break; case 1: // Ag News fragment = new AgNewsFragment(); break; case 2: // Market Updates fragment = new MarketUpdatesFragment(); break; case 3: // Tours & Conferences fragment = new ToursFragment(); break; case 4: // KFB Magazine fragment = new KFBMagFragment(); break; case 5: // Member Benefits fragment = new BenefitsFragment(); break; case 6: // Ag Facts fragment = new AgFactsFragment(); break; case 7: // Farm Markets fragment = new RSFMFragment(); break; case 8: // Weather fragment = new WeatherLocationFragment(); break; case 9: // Annual Meeting fragment = new AnnualMeetingFragment(); break; case 10: // Media fragment = new MediaFragment(); break; case 11: // My KYFB fragment = new MyKYFB(); break; case 12: // About KYFB break; case 13: // Contact Info break; case 14: // Preferences break; default: break; } if(fragment != null) { FragmentManager fragmentManager = getFragmentManager(); fragmentManager.beginTransaction().replace(R.id.frame_container, fragment).commit(); // update selected item and title, then close the drawer mDrawerList.setItemChecked(position, true); mDrawerList.setSelection(position); setTitle(navMenuTitles[position]); mDrawerLayout.closeDrawer(mDrawerList); } else { // error in creating fragment Log.e("MainActivity", "Error in creating fragment"); } } @Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.main, menu); menuItem = (MenuItem)menu.findItem(R.id.action_settings); marketListItem = (MenuItem)menu.findItem(R.id.marketList); mapItem = (MenuItem)menu.findItem(R.id.map); menuItem.setVisible(false); marketListItem.setVisible(false); mapItem.setVisible(false); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { // toggle nav drawer on selecting action bar app icon/title if(mDrawerToggle.onOptionsItemSelected(item)) { return true; } // handle action bar actions click switch(item.getItemId()) { case R.id.action_settings: return true; default: return super.onOptionsItemSelected(item); } } /*** * Called when invalidateOptionsMenu() is triggered */ @Override public boolean onPrepareOptionsMenu(Menu menu) { // if nav drawer is opened, hide the action items boolean drawerOpen = mDrawerLayout.isDrawerOpen(mDrawerList); menu.findItem(R.id.action_settings).setVisible(!drawerOpen); return super.onPrepareOptionsMenu(menu); } @Override public void setTitle(CharSequence title) { mTitle = title; getActionBar().setTitle(mTitle); } /** * When using the ActionBarDrawerToggle, you must call it during * onPostCreate() and onConfigurationChanged()... */ @Override protected void onPostCreate(Bundle savedInstanceState) { super.onPostCreate(savedInstanceState); // sync the toggle state after onRestoreInstanceState has occurred mDrawerToggle.syncState(); } @Override public void onConfigurationChanged(Configuration newConfig) { super.onConfigurationChanged(newConfig); // pass any configuration changes to the drawer toggle mDrawerToggle.onConfigurationChanged(newConfig); } ```

Original source