android - 底部导航 View - 渐变图标色调

Question

我在按下图标时使用选择器和渐变颜色更改了 BottomNavigationView 中的图标色调，但是将图标色调更改为渐变 Android 使我所有的图标都变成了紫色。 我的问题是是否有可能将 BottomNavigationView 中的图标色调更改为渐变色？

底部导航代码:

<com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/nav_bottom_main"
        android:layout_width="match_parent"
        app:itemIconTint="@color/bottom_menu_background"
        android:layout_height="wrap_content"
        app:menu="@menu/bottom_navigation_main"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

底部菜单背景:

 <?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
     <item android:color="@color/button_gradient_blue" android:state_checked="true" />
     <item android:color="@color/baseGray"/>
 </selector>

button_gradient_blue:

<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_pressed="true" >
        <shape android:shape="rectangle"  >
            <corners android:radius="@dimen/base_button_radius" />
            <gradient android:angle="0" android:startColor="@color/light_blue_gradient_start"
            android:endColor="@color/light_blue_gradient_end"  />
        </shape>
    </item>
    <item android:state_focused="true">
        <shape android:shape="rectangle"  >
            <corners android:radius="@dimen/base_button_radius" />
            <solid android:color="@color/button_pressed_color"/>
        </shape>
    </item>
    <item >
        <shape android:shape="rectangle"  >
            <corners android:radius="@dimen/base_button_radius" />
            <gradient android:angle="0" android:startColor="@color/light_blue_gradient_start"
            android:endColor="@color/light_blue_gradient_end" />
        </shape>
    </item>
</selector>

Answer 1

实现这一点比创建子类更简单的方法是创建两个单独的可绘制对象，然后创建一个选择器指定为底部导航 View 的菜单图标。

Activity .xml:

<android.support.design.widget.BottomNavigationView
    android:id="@+id/navigation"
    app:itemIconTint="@drawable/sel_navigation"
    app:itemTextColor="@drawable/sel_navigation_label"
    app:menu="@menu/navigation" />

菜单/导航.xml:

<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
    android:id="@+id/navigation_history"
    android:icon="@drawable/ic_history_selector"
    android:title="@string/title_history" />
</menu>

drawable/ic_history_selector.xml:

    <selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/ic_history_selected" android:state_pressed="true" />
<item android:drawable="@drawable/ic_history_selected" android:state_checked="true"/>
<item android:drawable="@drawable/ic_history"/>
</selector>

drawable/ic_history.xml:

<vector ...>
<path android:fillColor="@color/gradient_orange" .../>
</vector>

颜色/gradient_orange.xml:

<gradient xmlns:android="http://schemas.android.com/apk/res/android"
android:angle="0"
android:endColor="@color/orange"
android:startColor="@color/lightOrange"
android:startX="0"
android:endX="0"
android:startY="0"
android:endY="100"
android:type="linear" />

最后，您需要将图标色调列表设置为空，这样它就不会使用 XML 中的图标色调颜色。与渐变完美搭配(API 24+)。

参见:https://stackoverflow.com/a/47203888