BottomNavigationView - 如何禁用选定的图标突出显示

Question

我有一个 bottomnavigation 视图，它根据选中与否的状态设置图标。

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/icon_tree"
        android:title="Tree"
        android:icon="@drawable/bottomnav_icon_home">
    </item>

</menu>

bottomnav_icon_home:

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

</selector>

当 android:state_checked 为真时，bottomnavigation 如何自动突出显示图标。

如何完全禁用 bottomnavigation 的图标选择突出显示？

我试过将 app:itemIconTint="@drawable/bottom_navigation_selector" 设置为 @null，但这不起作用

<com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_navigation"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:menu="@menu/bottom_navigation_menu"
            android:background="@color/colorWhite"
            app:itemTextColor="@drawable/bottom_navigation_selector"
            app:itemIconSize="28dp"
            app:itemIconTint="@drawable/bottom_navigation_selector"
            app:labelVisibilityMode="labeled"/>

bottom_navigation_selector:

<?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/forestGreen" />
    <item android:color="@color/colorBlack" />
</selector>

Answer 1

尝试在 dimens.xml

中添加这一行

<dimen name="design_bottom_navigation_active_text_size" tools:override="true">@dimen/design_bottom_navigation_text_size</dimen>

Answer 2

您考虑创建自己的 bottomNavigation 实现吗？当我实现 Google BottomNavigationView 时，我遇到了很多问题，所以我创建了一个新的，如下所示：

<LinearLayout android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:orientation="vertical"
              android:layout_alignParentBottom="true">

    <View android:layout_width="match_parent"
          android:layout_height="1dp"
          android:background="@color/grayBottomNavigationDelimiter"/>

    <RadioGroup android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@color/colorNavigationBar"
                android:orientation="horizontal">

        <android.support.v7.widget.AppCompatRadioButton
            android:id="@+id/homeButton"
            android:drawableTop="@drawable/ic_home_black_24dp"
            android:text="@string/navigation_home_text"
            style="@style/RadioButtonStyle"/>
...

所以，你能看出这比想象的要容易吗？

Answer 3

如果我没理解错的话，android 默认情况下会在选择时在底部导航图标上设置色调，您希望将其删除。

不过我知道如何在你的 java class 中做到这一点，而不是 xml。

您需要将 BottomNavigationView 的 setItemIconTintList 方法设置为 null。因此，无论您在哪里设置布局，都应将代码编写为：

BottomNavigationView btmNav = findViewById(R.id.bottom_navigation);
btmNav.setItemIconTintList(null);

让我们知道这是否适合您。

Answer 4

您可以创建自定义样式。

有两个步骤。

1- 在可绘制文件夹中创建自定义 bottom_navigation_bar_icon_color.xml。这是选择器显示的图标突出显示或默认。因此，您可以突出显示所有图标或将它们显示为默认值。创建您的 bottom_navigation_bar_icon_color.xml

时选择以下选项之一

突出显示的图标：<item android:alpha="1.0" android:color="?attr/colorOnPrimary" android:state_checked="true"/>
默认图标：<item android:alpha="0.6" android:color="?attr/colorOnPrimary"/>

bottom_navigation_bar_icon_color.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:alpha="0.6" android:color="?attr/colorOnPrimary"/>
</selector>

2- 将以下自定义样式添加到 themes.xml 或 styles.xml。 bottom_navigation_bar_icon_color 用于 itemIconTint 和 itemTextColor

<style name="BottomNavigationThemeCustom">
    <item name="enforceTextAppearance">true</item>
    <item name="enforceMaterialTheme">true</item>
    <item name="android:background">?attr/colorPrimary</item>
    <item name="itemIconTint">@drawable/bottom_navigation_bar_icon_color</item>
    <item name="itemRippleColor">@color/mtrl_navigation_bar_colored_ripple_color</item>
    <item name="itemTextAppearanceInactive">?attr/textAppearanceCaption</item>
    <item name="itemTextAppearanceActive">?attr/textAppearanceCaption</item>
    <item name="itemTextColor">@drawable/bottom_navigation_bar_icon_color</item>
</style>

3- 将您的新样式用于 bottomNavigationBar

<com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottomNavigation"
            style="@style/BottomNavigationThemeCustom"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:visibility="visible"
            app:labelVisibilityMode="unlabeled"
            app:menu="@menu/bottom_menu" />

4- 如果你想在滚动时隐藏 bottomNavigationBar 添加以下属性到 bottomNavigationBar

app:layout_behavior="com.google.android.material.behavior.HideBottomViewOnScrollBehavior"

Answer 5

通过 XML 添加：对于属性 IconItemTint 和 ItemTextColor，只需使用与您相同的颜色默认情况下用于图标。在这种情况下，突出显示颜色和默认颜色将相同。将在选择时为您提供所需的连锁反应，但高亮显示不可见。

对于我的黑色图标，我使用了这个：

    app:itemIconTint="@color/black"
    app:itemTextColor="#000000"

我的整个底部导航是这样的：

    <com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottomNavigationView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?android:attr/windowBackground"
    app:itemIconTint="@color/black"
    app:itemTextColor="#000000"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:menu="@menu/bottom_nav_more_options_menu" />

BottomNavigationView - 如何禁用选定的图标突出显示

BottomNavigationView - How to disable selected icon highlight

android

android-bottomnavigationview