如何在BottomNavigationView中显示没有色调颜色的菜单项图标

Question

如何在BottomNavigationView中显示没有色调颜色的菜单项图标

androidmenubottomnavigationviewmenu-items

15

我已经创建了一个包含三个项目的BottomNavigationView，其中之一是用户选项卡。

对于访客选项卡，存在一张图片，但是正在应用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" />

底部颜色状态.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>

提前感谢

- noobEinstien

6个回答

7

我知道这个帖子很旧，但也许答案仍然能帮助一些偶然发现这个帖子的人。

我们遇到了同样的问题（使用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），源（在这种情况下是着色颜色）将被忽略，目标（需要着色的图标）保持不变。

- Johannes Schamburger

嘭嘭和嘭。这是我一生中见过的最好的答案。+1。 - Sambhav Khandelwal

颜色对我仍然被应用。这个没有起作用。 - JCutting8

2

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

- Mohamed Elmahalwy

1

你的回答可以通过提供更多支持信息来改进。请编辑以添加进一步的细节，例如引用或文档，以便他人可以确认你的答案是正确的。您可以在帮助中心中找到有关如何编写良好答案的更多信息。 - Community

完美，干得好。图片来了。 :) - undefined

0

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

仅适用于Android版本>= 26

- SuperGenedy

0

在多彩标签图标中主要使用此代码。

以下解决方案适用于我 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>

- Manthan Patel

-1

在资源文件夹中添加颜色资源文件夹，并将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>

- Chetan Shelake

1

那么如何使用？@Chetan - Himani

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Skytile · Accepted Answer

似乎没有办法仅更改一个菜单项的色调，因为BottomNavigationView将色调应用于从包装可绘制对象中的列表中的每个项目。您需要从导航视图中删除色调列表，并在每个菜单项图标上分别设置您的色调列表。然后，在您想要着色的每个菜单项图标中，设置您的颜色状态列表。

<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。