Android 5.0 - Animate the AppCompat v7 21 home icon from burger to back arrow programmatically

Question

I'm currently updating a Fragment oriented app (I have one Activity with a FrameLayout container as host for all my Fragments) to Material Design. And I would like to animate the burger icon to the back arrow when replacing a Fragment.

Basically, if this wasn't clear enough, here is what I want to achieve. I don't want to use this library (MaterialMenu), I'd like to use the official AppCompat lib to the extend of possible.

I achieved this effect thanks to this solution, but I can't figure out how to make to ActionBarDrawerToggle as a back button when a Fragment is replaced.

So my questions is : should the back arrow icon still be the ActionBarDrawerToggleonce the Fragement has been replaced? In which case how do I override it so it acts like onBackPressed() instead of openning the drawer ? I already tried this but it doesn't work :

 @Override
    public boolean onOptionsItemSelected(MenuItem item)
    {
        switch (item.getItemId())
        {
            case android.R.id.home:
                getActivity().onBackPressed();
                return true;
         }
         return false;
    }

Thanks in advance.

Answer 1

I think it's a little cleaner to track inside the drawer toggle if you've manually opened it or not. This is what I ended up doing:

public class ManualActionBarDrawerToggle extends ActionBarDrawerToggle {
    private static final float MENU_POSITION = 0f;
    private static final float ARROW_POSITION = 1.0f;

    private final int animationLength;
    private final DrawerLayout drawerLayout;
    private final Activity activity;
    private State currentState;

    private enum State { UP_ARROW, MENU }

    public ManualActionBarDrawerToggle(Activity activity, DrawerLayout drawerLayout, int openDrawerContentDescriptionResource, int closeDrawerContentDescriptionResource) {
        super(activity, drawerLayout, openDrawerContentDescriptionResource, closeDrawerContentDescriptionResource);
        animationLength = activity.getResources().getInteger(android.R.integer.config_shortAnimTime);
        this.drawerLayout = drawerLayout;
        this.activity = activity;
        currentState = State.MENU;
    }

    public void animateToBackArrow() {
        ValueAnimator anim = ValueAnimator.ofFloat(MENU_POSITION, ARROW_POSITION);
        anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator valueAnimator) {
            float slideOffset = (Float) valueAnimator.getAnimatedValue();
            onDrawerSlide(drawerLayout, slideOffset);
            }
        });

        anim.setInterpolator(new DecelerateInterpolator());
        anim.setDuration(animationLength);
        anim.start();

        currentState = State.UP_ARROW;
    }

    public void animateToMenu() {
        ValueAnimator anim = ValueAnimator.ofFloat(ARROW_POSITION, MENU_POSITION);
        anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator valueAnimator) {
                float slideOffset = (Float) valueAnimator.getAnimatedValue();
                onDrawerSlide(drawerLayout, slideOffset);
            }
        });

        anim.setInterpolator(new DecelerateInterpolator());
        anim.setDuration(animationLength);
        anim.start();

        currentState = State.MENU;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()) {
            case (android.R.id.home):
                if (currentState == State.UP_ARROW) {
                    activity.onBackPressed();
                    return true;
                }
        }
        return super.onOptionsItemSelected(item);
    }
}

Answer 2

Menu drawable of this library has a method that can animate states:

If you want to switch from Burger to Arrow you do this call:

mMaterialMenu.animateState(IconState.ARROW);