android - 如何在 BottomNavigationView 中显示不带色调的菜单项图标

Question

我BottomNavigationView用三个项目创建了一个。其中之一是user tab。

对于访客选项卡，有一个图像，但 TintColor 正在应用，我们看不到。

那么如何删除该特定项目的色调？

我努力了

 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
                            item.setIconTintList(null);

                        }

但没有运气。它适用于以上 api 26

我的活动

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottomNavigationView"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:itemIconTint="@drawable/bottom_color_state"
    app:itemBackground="@color/colorAccent"
    app:itemTextColor="@drawable/bottom_color_state"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:menu="@menu/menu_bottom_navigation" />

bottom_color_state.xml

    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:color="@color/white" android:state_enabled="true" />
        <item android:color="@color/colorPrimaryDark" android:state_enabled="false" />
        <item android:color="@color/white" android:state_selected="true" />
        <item android:color="@color/off_white" android:state_selected="false" />
        <item android:color="@color/white" android:state_checked="true" />
        <item android:color="@color/off_white" android:state_checked="false" />
        <item android:color="@color/off_white" />
    </selector>

提前致谢

score 27 · Accepted Answer

似乎没有办法只更改一个菜单项的色调，因为 BottomNavigationView 将色调从包装器绘制应用到列表中的每个项目。您需要从导航视图中删除色调列表，并分别在每个菜单项图标上设置色调列表。

navView.itemIconTintList = null

然后在要着色的每个菜单项图标中，在矢量可绘制对象上设置颜色状态列表。

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportHeight="24.0"
    android:viewportWidth="24.0">
    <path
        android:fillColor="@color/bottom_color_state"
        android:pathData="M10,20v-6h4v6h5v-8h3L12,3 2,12h3v8z"/>
</vector>

我早在 API 21 就测试了该解决方案。

score 2 · Accepted Answer

我知道这个线程已经相当老了，但也许答案可以帮助一些偶然发现线程的人。

我们遇到了同样的问题（使用 NavigationView 而不是 BottomNavigationView），出于某种原因，Skytile 的解决方案对我们不起作用。

正如 Skytile 所指出的，不可能（至少在 API 级别 < 26 上）为单个项目设置自定义色调列表。但是，可以设置色调模式：

val itemsWithoutTint: List<Int> = listOf(12345)
for (i in 0 until getMenu().size()) {
    val item = getMenu().getItem(i)
    if (item.itemId in itemsWithoutTint) {
        MenuItemCompat.setIconTintMode(item, PorterDuff.Mode.DST)
    }
}

通过将 TintMode 设置为 DST ( https://developer.android.com/reference/android/graphics/PorterDuff.Mode )，源（在本例中为色调颜色）将被忽略，而目标（要着色的图标）保持不变。

score 0 · Accepted Answer

主要在多色选项卡图标时使用此代码。

下面的解决方案对我有用， android:theme="@style/ActivityTranslucent" app:tabIconTintMode="multiply" app:tabIconTint="#ffffff"这三个属性主要显示您的标签图标。

                 <com.google.android.material.tabs.TabLayout
                    android:id="@+id/tlProfile"
                    android:layout_gravity="bottom"
                    android:layout_width="match_parent"
                    android:layout_height="?actionBarSize"
                    android:background="#202026"
                    android:theme="@style/ActivityTranslucent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    app:tabIndicator="@drawable/ic_tab_indicator"
                    app:tabIndicatorColor="#1ed5cf"
                    app:tabIndicatorFullWidth="false"
                    app:tabIndicatorGravity="bottom"
                    app:tabIndicatorHeight="@dimen/_3sdp"
                    app:tabPaddingBottom="5dp"
                    app:tabIconTintMode="multiply"
                    app:tabIconTint="#ffffff"
                    app:tabPaddingTop="5dp"
                    app:tabRippleColor="@color/colorAccent">

                    <com.google.android.material.tabs.TabItem
                        android:id="@+id/tiSound"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:icon="@drawable/ic_sound_change"
                        android:text="" />


                    <com.google.android.material.tabs.TabItem
                        android:id="@+id/tiVideo"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:icon="@drawable/ic_video_change"
                        android:text="" />

                    <com.google.android.material.tabs.TabItem
                        android:id="@+id/tiLke"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:icon="@drawable/ic_like_change"
                        android:text="" />


                </com.google.android.material.tabs.TabLayout>

score 0 · Accepted Answer

使用“null”值设置应用于我们菜单项图标的色调，这对我有用。

https://i.stack.imgur.com/BNwH6.png

score 0 · Accepted Answer

与 Skytile 说的不同，我发现您实际上可以使用setIconTintMode(null)更改一个菜单项的色调，而无需使用setIconTintList

仅适用于 android >= 26

score 0 · Accepted Answer

在资源中添加颜色资源文件夹并将bottom_color_state放入该文件夹并替换您的bottom_color_state代码如下

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

android - 如何在 BottomNavigationView 中显示不带色调的菜单项图标

6 回答 6

Related

Reference