底部导航视图图标更改不起作用

Question

我想在切换项目时切换到底部导航视图的图标。

我有浅蓝色图标和深蓝色图标的选定项目。我正在为每个导航项目使用选择器drawable，但我看到下面这样的图像，灰色为非活动图像，蓝色为活动图像

这是我的代码

bottom_nav_menu

    <?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/navigation_home"
        android:icon="@drawable/home_icon_selector"
        android:title="@string/title_home" />

    <item
        android:id="@+id/navigation_scheduler"
        android:icon="@drawable/schelduler_icon_selector"
        android:title="@string/title_scheduler" />

    <item
        android:id="@+id/navigation_favourites"
        android:icon="@drawable/favourites_icon_selector"
        android:title="@string/title_favourites" />


    <item
        android:id="@+id/navigation_settings"
        android:icon="@drawable/settings_icon_selector"
        android:title="@string/title_settings" />
</menu>

家

    <com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/nav_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginStart="@dimen/margin_20"
    android:layout_marginLeft="@dimen/margin_20"
    android:layout_marginRight="@dimen/margin_20"
    android:layout_marginEnd="@dimen/margin_20"
    android:layout_marginBottom="@dimen/margin_8"
    android:background="@drawable/bottom_navigation_background"
    android:elevation="8dp"
    app:itemIconTint="@drawable/bottom_navigation_color_selector"
    app:labelVisibilityMode="unlabeled"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:menu="@menu/bottom_nav_menu" />

和选择器

计划程序选择器

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

设置选择器

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

收藏夹选择器

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

首页选择器

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

活动代码

    val navView: BottomNavigationView = findViewById(R.id.nav_view)
    val navController = findNavController(R.id.nav_host_fragment)
    // Passing each menu ID as a set of Ids because each
    // menu should be considered as top level destinations.
    val appBarConfiguration = AppBarConfiguration(setOf(
            R.id.navigation_home, R.id.navigation_scheduler, R.id.navigation_favourites, R.id.navigation_settings))
    //  setupActionBarWithNavController(navController, appBarConfiguration)
    navView.setupWithNavController(navController)

我做错了什么？请帮助。。。

编辑：我正在使用以下绘图工具

在此处输入链接描述

在此处输入链接描述

Answer 1

您可以使用@Chris所说的选择器来实现这一点，或者您可以使用setOnNavigationItemSelectedListener{}动态执行此操作

更新-对于更改图标，您可以通过更改当前的项来强制执行。图标要填充图标，其他图标要未填充图标，请参见此处以获取其要点（不要将其复制到tabLayout）。

navView.setOnNavigationItemSelectedListener { item -> 
            // change  the icon to filled icon
            true
        }

listner似乎已贬值，请参考此

Answer 2

这只是一个粗略的猜测，但这里可能有这样一句话：

app:itemIconTint="@drawable/bottom_navigation_color_selector"

是否影响了您的拖鞋颜色？如果您的抽绳具有正确的颜色（浅蓝色/深蓝色），则应与当前的选择器配合使用。

或者，检查您没有以其他方式为底部导航设置app： itemIconTint，例如通过主题或以编程方式！

Answer 3

此问题的原因是app： itemIconTint总是有一个值，即使不使用它，它也采用原色/重音颜色的默认值。

因此，要解决您的问题，您需要明确禁用它：

val btmNav = findViewById<BottomNavigationView>(R.id.nav_view)
navView.itemIconTintList = null

虽然我确实推荐了另一件事：

图标已经是处于选中/未选中状态的相同图标，但具有不同的色调。如果这些图标是矢量，那么您可以使用app： itemIconTint中的选择器着色，并使用单个版本的图标，而无需复制资源：

icon\u color\u选择器。xml：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="#2596CD" android:state_checked="true" />
    <item android:color="#84D0F4" android:state_checked="false" />
</selector>

并应用：

<com.google.android.material.bottomnavigation.BottomNavigationView
    ...
    app:itemIconTint="@drawable/icon_color_selector"

并仅保留带有图标的菜单项，而不保留选择器，例如：

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/navigation_home"
        android:icon="@drawable/home_icon"  //<<<<< icon not selector
        android:title="@string/title_home" />

    ....

</menu>

更新：

在使用导航体系结构组件时，请确保在底部导航视图（bottomNavView）菜单中具有与底部导航视图（bottomNavView）片段的导航图（navGraph）中对应的ID相同的ID。

如果您不使用navGraph作为BotomNavView片段，那么您就不能使用navView.setupNevNavController（navController）

这是您的可绘制图标