底部导航视图中选定选项卡的颜色

Question

我正在向项目中添加一个底部导航视图（BottomNavigationView），我希望所选选项卡具有不同的文本（和图标色调）（以实现灰显非所选选项卡的效果）。在颜色选择器资源文件中对android:state\u selected=“true”使用不同的颜色似乎不起作用。我还尝试使用android:state\u-focused=“true”或android:state\u-enabled=“true”添加项目条目，但遗憾的是没有效果。还尝试将默认（未选择）颜色的“state\u selected”（状态选择）属性设置为false（显式），但没有成功。

以下是如何将视图添加到布局中：

<android.support.design.widget.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        app:itemBackground="@color/silver"
        app:itemIconTint="@color/bnv_tab_item_foreground"
        app:itemTextColor="@color/bnv_tab_item_foreground"
        app:menu="@menu/bottom_nav_bar_menu" />

这是我的颜色选择器（bnv\u tab\u item\u foreground.xml）：

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

和我的菜单资源（bottom\u nav\u bar\u menu.xml）：

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

    <item
        android:id="@+id/action_home"
        android:icon="@drawable/ic_local_taxi_black_24dp"
        android:title="@string/home" />
    <item
        android:id="@+id/action_rides"
        android:icon="@drawable/ic_local_airport_black_24dp"
        android:title="@string/rides"/>
    <item
        android:id="@+id/action_cafes"
        android:icon="@drawable/ic_local_cafe_black_24dp"
        android:title="@string/cafes"/>
    <item
        android:id="@+id/action_hotels"
        android:icon="@drawable/ic_local_hotel_black_24dp"
        android:title="@string/hotels"/>

</menu>

如果有任何帮助，我将不胜感激。




Answer 1

BottomNavigationView使用应用于所选选项卡的主题中的colorPrimary，并使用android:textColorSecondary作为非活动选项卡图标的色调。

因此，您可以使用首选的主颜色创建样式，并将其设置为xml布局文件中的底部导航视图的主题。

样式。xml：

 <style name="BottomNavigationTheme" parent="Theme.AppCompat.Light">
        <item name="colorPrimary">@color/active_tab_color</item>
        <item name="android:textColorSecondary">@color/inactive_tab_color</item>
 </style>

您的\u布局。xml：

<android.support.design.widget.BottomNavigationView
            android:id="@+id/navigation"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?android:attr/windowBackground"
            android:theme="@style/BottomNavigationTheme"
            app:menu="@menu/navigation" />

Answer 2

1、在res内创建名为color的文件夹（如drawable）

2、右键单击颜色文件夹。选择新建-

3、复制粘贴bnv\u tab\u item\u前台

<android.support.design.widget.BottomNavigationView
            android:id="@+id/navigation"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginEnd="0dp"
            android:layout_marginStart="0dp"
            app:itemBackground="@color/appcolor"//diffrent color
            app:itemIconTint="@color/bnv_tab_item_foreground" //inside folder 2 diff colors
            app:itemTextColor="@color/bnv_tab_item_foreground"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:menu="@menu/navigation" />

bnv_tab_item_foreground：

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

图1：文件结构：

Answer 3

在创建选择器时，始终在末尾保持默认状态，否则只会使用默认状态。您需要将选择器中的项目重新排序为：

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

与底部导航栏一起使用的状态是选中的状态，而不是选中的状态。