Skip to content Skip to sidebar Skip to footer

Change Back Icon Color In Toolbar

I'm using the Android component navigation for a DrawerLayout with NavigationView. public class MainActivity extends AppCompatActivity { private DrawerLayout drawerLayout;

Solution 1:

use this style

<stylename="ToolbarTheme"parent="@style/ThemeOverlay.AppCompat.ActionBar"><!-- Customize color of Toolbar --><itemname="colorControlNormal">@color/WhiteColor</item></style>

and then use it in app:theme="@style/ToolbarTheme" in your Toolbar XML :

 <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar_menu"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#000000"
        android:textColor="#FFF"
        android:textColorPrimary="#FFF"
        app:theme="@style/ToolbarTheme"
        app:layout_constraintTop_toTopOf="parent"
        app:titleTextColor="#FFF"
        app:title="@string/app_name"/>

Solution 2:

Another option, with new Themes (Light/Dark modes) is to use styles and themes.

First approach.

  1. This works if you use default icons and in a fragment (e.g.) you use following: toolbar.setupWithNavController(findNavController()), so then in layout you must do following:
  2. In your app theme in xml:
<stylename="Theme.MyApp"parent="Theme.MaterialComponents.DayNight.NoActionBar">
    ...
    <itemname="drawerArrowStyle">@style/MyDrawerArrowToggleStyle</item>

Note: This solution is for your own toolbars, which you placed in your layout by yourself, that's why my main app theme is Theme.MaterialComponents.DayNight.NoActionBar. However, I haven't tried with default ActionBar, so maybe it will work as well.

  1. Your drawer arrow/toggle style:
<stylename="MyDrawerArrowToggleStyle"parent="Widget.AppCompat.DrawerArrowToggle"><itemname="color">@color/your_color_here</item></style>

And now all default "<-" icons in toolbars will be in your color. It should work for Hamburger icons too. But I didn't check, as I don't have navigation drawer.

Second approach.

When you want your own icon or action in NavigationOnClickListener.

  1. In the fragment:
toolbar.setNavigationOnClickListener { 
   findNavController().navigateUp()
   //plus another actions if required
}
toolbar.setNavigationIcon(R.drawable.your_icon_here)
  1. In main theme:
<itemname="toolbarNavigationButtonStyle">@style/MyAppToolbarNavButtonStyle</item>
  1. My style:
<stylename="MyAppToolbarNavButtonStyle"parent="Widget.AppCompat.Toolbar.Button.Navigation"><itemname="tint">@color/your_color_here</item></style>

Post a Comment for "Change Back Icon Color In Toolbar"