change back arrow image in Actionbar with appcompa

Question

I have an Actionbar from android.support.v7.widget.Toolbar. It has hamburger image with animation to back arrow, I want to change back arrow from <- to ->. how can I do this in Android Studio?

I read somewhere to change it with setHomeAsUpIndicator() method, but it change hamburger button and it has no animation to back arrow.

Answer 1

Try this:

//Find the action bar for customizations
    final ActionBar ab = getSupportActionBar();
    assert ab != null;

    //Make the action bar display an up arrow and set its drawable and color
    ab.setDisplayHomeAsUpEnabled(true);
    final Drawable upArrow = ResourcesCompat.getDrawable(
            getResources(),
            R.drawable.abc_ic_ab_back_mtrl_am_alpha, //this is the <- arrow from android resources. Change this to the thing you want.
            null);
    assert upArrow != null;
    upArrow.setColorFilter(
            ContextCompat.getColor(
                    getApplicationContext(),
                    R.color.white // change this to the color you want (or remove the setColorFilter call)
            ),
            PorterDuff.Mode.SRC_ATOP);
    ab.setHomeAsUpIndicator(upArrow);

Answer 2

There are at least half a dozen ways to do this, but probably the simplest and shortest is to use reflection to grab the ActionBarDrawerToggle's Drawable, and flip its direction.

This example wraps that functionality in a subclass, and should work no matter your ActionBar/Activity setup (provided the original class worked there in the first place).

public class FlippedDrawerToggle extends ActionBarDrawerToggle {
    public FlippedDrawerToggle(Activity activity, DrawerLayout drawerLayout,
        int openDrawerContentDescRes, int closeDrawerContentDescRes) {

        this(activity, drawerLayout, null,
            openDrawerContentDescRes, closeDrawerContentDescRes);
    }

    public FlippedDrawerToggle(Activity activity, DrawerLayout drawerLayout,
        Toolbar toolbar, int openDrawerContentDescRes, int closeDrawerContentDescRes) {

        super(activity, drawerLayout, toolbar,
             openDrawerContentDescRes, closeDrawerContentDescRes);

        try {
            Field sliderField = ActionBarDrawerToggle.class.getDeclaredField("mSlider");
            sliderField.setAccessible(true);
            DrawerArrowDrawable arrow = (DrawerArrowDrawable) sliderField.get(this);
            arrow.setDirection(DrawerArrowDrawable.ARROW_DIRECTION_RIGHT);
        }
        catch (NoSuchFieldException | IllegalAccessException e) {
            // Fail silently
        }
    }
}

This will only change the direction of the toggle's image. If you actually want the whole ActionBar/Toolbar to be flipped, you should instead change the layout's direction accordingly.

Answer 3

Add this condition between mDrawerToggle = new ActionBarDrawerToggle... and mDrawerToggle.syncState(); like this :

mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);


if (getResources().getConfiguration().getLayoutDirection() == View.LAYOUT_DIRECTION_RTL)
{
      toolbar.setLayoutDirection(View.LAYOUT_DIRECTION_RTL);
}


mDrawerToggle.syncState();