Hamburger to arrow animation not working programmatically

Question

I have made a server directory browsing app which would change contents within the Activity itself. I have been adding a feature: Navigation Drawer and handling the Hamburger and Back icon on the Toolbar as follows:

Home directory:
1. Hamburger icon as the default state.
2. Would slide the navigation drawer on clicking the hamburger or at a sliding gesture.
3. No state-change or animation of the hamburger when the drawer is slided.
4. Animation of Hamburger to Back icon when a directory is chosen.
Any child directory:
1. Back button from the previous animation whose sole purpose is to go to a parent directory.
2. Would slide the navigation drawer at a sliding gesture.
3. No state-change or animation of the Back icon when the drawer is slided using gesture or when it goes into an another child directory of this directory.
4. Animation of Back Arrow to Hamburger icon when it comes back to Home directory using back icon or onBackPressed.

I am able to get the animation of Hamburger to Back icon using this answer (Code is used verbatim is as below) but wasn't able to get the Hamburger icon again when coming back into the home directory (didn't included that code and went for another approach which is the next part):

ValueAnimator anim = ValueAnimator.ofFloat(0f, 1f);
anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    @Override
    public void onAnimationUpdate(ValueAnimator valueAnimator) {
        float slideOffset = (Float) valueAnimator.getAnimatedValue();
        mDrawerToggle.onDrawerSlide(drawerLayout, slideOffset);
    }
});
anim.setInterpolator(new DecelerateInterpolator());
// You can change this duration to more closely match that of the default animation.
anim.setDuration(500);
anim.start();

For appropriate switching between Hamburger and Back icons when browsing to and fro from home and child directories, I have used this answer (Code verbatim as below) as a reference and was able to successfully implement it for 1, 2 and 3 features of home and child directories.

private void enableViews(boolean enable) {

    if(enable) {
        mDrawerToggle.setDrawerIndicatorEnabled(false);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

        getSupportActionBar().setHomeButtonEnabled(true); // comment this line of code

        if(!mToolBarNavigationListenerIsRegistered) {
            mDrawerToggle.setToolbarNavigationClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    // Doesn't have to be onBackPressed
                    onBackPressed();
                }
            });
            mToolBarNavigationListenerIsRegistered = true;
        }
    }
    else {
        // Remove back button
        getSupportActionBar().setDisplayHomeAsUpEnabled(false);
        getSupportActionBar().setHomeButtonEnabled(false); // comment this line of code

        // Show hamburger
        mDrawerToggle.setDrawerIndicatorEnabled(true);
        // Remove the/any drawer toggle listener
        mDrawerToggle.setToolbarNavigationClickListener(null);
        mToolBarNavigationListenerIsRegistered = false;
    }
}

Coming to the issue at hand which is: While browsing directories, of the switching to and fro from Hamburger to Back icon, the animation part is not working at all. But the states of both the icons are successfully changed along with their functionalities. Let me know if you need some more information for troubleshooting.

Do you start a new activity to display child directory or is it the same activity with a new fragment ? — Dibzmania, Jan 26 '17 at 12:29
@Dibzmania Same activity. I'm just updating the GridView (custom one with Image + Text) over it, I haven't used any kind of Fragment in this project. I'm just putting pieces from the Internet plus useful documentation together and make it work after understanding the solution and updating it to my requirements. Nevertheless, I just solved it, and I have updated with an answer for future references. — burglarhobbit, Jan 26 '17 at 12:53

score 1 · Answer 1 · answered Jan 26 '17 at 10:07

You can see a working example of navigation drawer activity if you just create a new project, add an activity and use template NavigationDrawer (if you use Android Studio. Otherwise download this repo)

When I want to learn a new layout I just load up the template and then change individual pieces of code until I have what I wanted. This way you can see what does what, what stops working when you delete some line and how things should be done.

burglarhobbit · Accepted Answer · 2017-01-26T13:01:53.043

I was finally able to solve it, came to know about the behaviour of the ActionBarDrawerToggle in a much deeper way after tinkering it with the default NavigationBarActivity from Android studio.

The overriding of onDrawerSlide of the mDrawerToggle to block the animation of hamburger by the sliding drawer was the cause of the same blocking of animation of hamburger to arrow in the animatior function in the first place. Notice these two lines from the two different pieces of code (didn't include it earlier, but you get the idea):
```
@Override
public void onDrawerSlide(View view, float slideOffset) {
    // blocks the animation
    super.onDrawerSlide(view, 0);
}

// from the animator function above
mDrawerToggle.onDrawerSlide(drawerLayout, slideOffset);
```

Solution: I removed the overrided onDrawerSlide function, but then, the sliding drawer hamburger to arrow animation would come back as well.

Counter-Solution: I also found out the sliding drawer animation of hamburger to arrow happens due to this line: mDrawerLayout.setDrawerListener(mDrawerToggle) which again is a deprecated function. So I just commented out this line and everything is working as expected.

Hamburger to arrow animation not working programmatically

2 Answers2