AND205 follow-up: DrawerNavigation animation

rene_ruppertrene_ruppert DEXamarin Team, University, XamUProfessors Xamurai

Following up the question about animating the hamburger icon and how to achieve it.
Please also see material design guidelines about the drawer: https://material.io/guidelines/patterns/navigation-drawer.html#navigation-drawer-specs

The ActionBarDrawerToggle type provides support for the animation. We can find this type in the v4 support library but also in v7. In v4 it accepts an animated parameter. The v4 version is now deprecated.

As seen in our exercise, you don't have to use ActionBarDrawerToggle at all, but if you do, you can get the animation back, by:

  1. Create an ActionBarDrawerToggle instance
_drawerToggle = new Android.Support.V7.App.ActionBarDrawerToggle(
                this,
                drawerLayout,
                toolbar,
                Resource.String.drawer_open,
                Resource.String.drawer_closed);
  1. Sync the drawer toggle with the drawer
_drawerToggle.SyncState();
  1. Override the activity's OnConfigurationChanged method and add
_drawerToggle.OnConfigurationChanged(newConfig);
  1. Override the activity's OnOptionsItemSelected and add

This will let the toggle open the drawer instead of us handling it.

if(_drawerToggle.OnOptionsItemSelected(item))
{
    return true;
}
  1. Set the drawer toggle as a listener on the drawer layout
drawerLayout.AddDrawerListener(_drawerToggle); 

The only issue with is: the drawer uses all of the screen space and you will barely see the animation. To make it visible you will have to adjust the NavigationView and maybe add a android:layout_marginTop="40dp"

Sign In or Register to comment.