How to change only the back arrow in toolbar?

Question

I'm using getSupportedActionBar().setTitle("This Phone");

I have managed to change the title color to white by using Toolbar.setTitleTextColor(0xFFFFFFFF);

How do I change the back arrow key color to white too?

score 4 · Answer 1 · answered Mar 07 '18 at 13:14

You can try this in your activity :- (After setSupportActionBar(toolbar) )

  Drawable backArrow = context.getResources().getDrawable(R.drawable.your_back_button);
  backArrow.setColorFilter(getResources().getColor(R.color.yourcolor), PorterDuff.Mode.SRC_ATOP);
  getSupportActionBar().setHomeAsUpIndicator(backArrow);

score 2 · Answer 2 · answered Feb 12 '20 at 12:43

Please have look below kotlin function which is working for me.

private fun setToolbarProperties() {
    setSupportActionBar(toolbar)
    supportActionBar?.setDisplayHomeAsUpEnabled(true)
    supportActionBar?.title = "" //If you don't want to set title
    val upArrow = resources.getDrawable(R.drawable.ic_action_back,theme);
    supportActionBar?.setHomeAsUpIndicator(upArrow);
}

Below is a toolbar xml code.

<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?android:attr/actionBarSize"
    android:background="@android:color/transparent"
    android:orientation="vertical"
    >

</androidx.appcompat.widget.Toolbar>

score 1 · Answer 3 · answered Mar 07 '18 at 13:39

Joy Dey.
Try to change your app theme to "Theme.AppCompat.Light.NoActionBar" in styles.xml.

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

Dawit Abraham · Answer 4 · 2018-12-06T17:40:05.713

1

Try changing the icon itself in styles.xml like this

    <style name="AppTheme" parent="Base.Theme.AppCompat.Light.DarkActionBar">

            <item name="android:homeAsUpIndicator">@drawable/ic_new_icon</item>
    </style>

edited Dec 06 '18 at 17:40

answered Oct 25 '18 at 23:00

Dawit Abraham

1,616
15
19

Abhishek kumar · Answer 5 · 2018-03-07T13:20:12.287

Try with below code :

Take image from drawable and then set color

final Drawable backArrow = getResources().getDrawable(R.drawable.back_img);
backArrow .setColorFilter(getResources().getColor(R.color.white), PorterDuff.Mode.SRC_ATOP);
getSupportActionBar().setHomeAsUpIndicator(backArrow );

If you want to change color of ToolBar title & back button image to white by style

Reference : https://stackoverflow.com/a/33339983/8448886

score 0 · Answer 6 · answered Mar 07 '18 at 13:50

Add below code in your style.xml

<style name="ToolbarStyle" parent="@style/ThemeOverlay.AppCompat.ActionBar">
  <!-- Customize color of navigation drawer icon and back arrow --> 
  <item name="colorControlNormal">@color/toolbar_color_control_normal</item>
</style>

And add this attribute app:theme="@style/ToolbarStyle" in your toolbar

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    app:theme="@style/ToolbarStyle" >
</android.support.v7.widget.Toolbar>

How to change only the back arrow in toolbar?

6 Answers6