Изменение цвета стрелки "назад" в Material Theme на API 21

Быстрый ответ

Чтобы быстро поменять цвет стрелки "назад" в Material Theme, задайте параметр android:tint в стиле вашей панели инструментов. Например:

<style name="ToolbarWithBackArrowColor" parent="Widget.MaterialComponents.Toolbar">
    <item name="android:navigationIcon">?attr/homeAsUpIndicator</item>
    <item name="android:tint">@color/custom_back_arrow_color</item>
</style>

Теперь примените этот стиль к вашему элементу Toolbar:

<com.google.android.material.appbar.Toolbar
    style="@style/ToolbarWithBackArrowColor" />

Вместо @color/custom_back_arrow_color укажите желаемый цвет.

Детальная настройка: погружение в код

Рассмотрим подробнее, как можно изменить цвет стрелки "назад".

Изменение цвета через атрибуты темы

Можно настроить атрибут colorControlNormal в теме вашего приложения, чтобы унифицировать цвет элементов навигации:

<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <item name="colorControlNormal">@color/custom_back_arrow_color</item>
</style>

Подробнее об этом расскажет наш спикер на видео

Изменение цвета в Java/Kotlin

Если требуется по ходу работы менять цвет стрелки программно, используйте следующий код:

if (toolbar.getNavigationIcon() != null) {
    toolbar.getNavigationIcon().setColorFilter(getResources().getColor(R.color.custom_back_arrow_color), PorterDuff.Mode.SRC_ATOP);
}

Учёт версии API

С API уровня 23 и выше можно использовать ресурс abc_ic_ab_back_material, не внося в него изменения.

Визуализация

Изменение цвета стрелки возврата подобно включению фар на автомобиле ночью:

🚗💡 До: [←] (стандартный цвет)
🚗💡 После: [←](#FF5722) (новый цвет!)

Даже небольшие изменения могут существенно улучшить внешний вид и узнаваемость приложения.

Продвинутые методы изменения цвета

Давайте изучим продвинутые способы изменения цвета стрелки "назад".

Пользовательские изображения

Чтобы добавить пользовательские изображения, укажите их в файле селектора:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/ic_arrow_back_black_24dp" android:tint="@color/custom_back_arrow_color" android:state_enabled="true" />
</selector>

Изменение цвета через DrawerArrowStyle

Используйте DrawerArrowStyle, чтобы цвет стрелки соответствовал общей теме приложения:

<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <item name="drawerArrowStyle">@style/MyDrawerArrowToggle</item>
</style>

<style name="MyDrawerArrowToggle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="color">@color/custom_back_arrow_color</item>
</style>

Улучшение навигации с помощью навигационной иконки

Не ограничивайтесь одной стрелкой, можно задать и новый навигационный значок:

<style name="ToolbarIconColor" parent="Widget.MaterialComponents.Toolbar">
    <item name="android:navigationIcon">@drawable/my_custom_icon</item>
    <item name="android:tint">@color/my_custom_color</item>
</style>

Полезные материалы

1. Material Design — Руководство по Material Components для Android.
2. Стили и темы | Разработчики Android — инструкции по настройке компонентов Material.
3. java – Как изменить цвет стрелки назад в новой Material теме? – Stack Overflow — обсуждение на Stack Overflow, посвященное изменению цвета стрелки.
4. Система цветов в Material Design — описание цветовой системы Material Design. Полезно при изменении цвета элементов.
5. Блог разработчиков Android: Используйте Android Jetpack для ускорения вашей разработки — информация об Android Jetpack и его компонентах, включая Material Components.
6. GitHub – material-components/material-components-android-examples: Примеры приложений и исходного кода для MDC-Android — примеры приложений и кода для использования для Material Design Components на Android.