android BottomNavigationView中的项目选择颜色

Question

我推荐this。单击计划时会出现计划活动，但始终选择第一个项目颜色（收藏夹）。它不会从收藏夹项目颜色更改计划项目颜色。还有，第三项（音乐）。我使用 android:state_checked 而不是 android:state_enabled。”如果使用 startActivity，它不会从收藏夹项目颜色更改计划项目颜色。如果不是，它会改变颜色。如何解决这个颜色选择问题。

activity_main.xml

app:itemIconTint="@drawable/nav_item_color_state"
app:itemTextColor="@drawable/nav_item_color_state"
app:menu="@menu/bottom_navigation_main"

@drawable/nav_item_color_state

<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" />
</selector>

Answer 1

在 res 文件夹中创建一个颜色目录并创建您的 xml 文件以自定义您的底部导航项：

res/color/bottom_nav_color.xml：

<?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/your_color" />
     <item android:state_checked="false" android:color="@color/your_color"/>
</selector>

并在您的BottomNavigationView 中将app:itemTextColor 和app:itemIconTint 值设置为@color/bottom_nav_color

<android.support.design.widget.BottomNavigationView
   xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:app="http://schemas.android.com/apk/res-auto"
   android:id="@+id/main_navigation"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:layout_alignParentBottom="true"
   android:background="@color/actionBarColor"
   app:menu="@menu/my_navigation_items"
   app:itemTextColor="@color/bottom_nav_color"
   app:itemIconTint="@color/bottom_nav_color"/>

Answer 2

1. 在drawable文件夹中创建一个xml文件，名称为navigation_view_colored.xml，并将其放入：

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

1. 将你创建的xml添加到app:itemIconTint

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/bottom_navigation"
    android:layout_alignParentBottom="true"
    app:itemIconTint="@drawable/navigation_view_colored"
    app:itemTextColor="@color/blue"
    app:menu="@menu/bottom_navigation"
    android:background="?android:attr/windowBackground"/>

Answer 3

这里是您问题的简单解决方案

<android.support.design.widget.TabLayout
....
app:tabBackground="@drawable/tab_color_selector"
...
/>

选择器res/drawable/tab_color_selector.xml:

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

根据您的要求更新选项卡项目选择器的颜色。

Answer 4

只需更改theme：

在values 中创建themes.xml 并添加此样式

<style name="BottomNavThem" parent="Theme.MaterialComponents.Light.NoActionBar">
    <item name="colorPrimary">@color/colorPrimaryRed</item>
</style>

并设置为BottomNavigationView

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottomNavigationView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:menu="@menu/main_navigation_menu"
    android:theme="@style/BottomNavThem"/>

Answer 5

在我的情况下，我使用了BottomNavigationBarEx 插件。所以，我必须这样做：

在我的 res/layout/layout_navigation_view.xml：

添加了app:itemIconTint="@drawable/bottom_nav_colors"。因为，我只使用图标。因此，如果您有文字，请添加以下内容：app:itemTextColor="@drawable/bottom_nav_colors"。

    <com.ittianyu.bottomnavigationviewex.BottomNavigationViewEx
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/bottomNavBar"
        android:background="@drawable/white_grey_border_top"
        app:itemIconTint="@drawable/bottom_nav_colors"
        app:menu="@menu/bottom_navigation_menu" />

然后在 res/drawable 目录中（因为selectors 需要包含在drawable 或animatable 目录中）添加selector（正如其他人提到的）：

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

然后在 res/values/colors.xml 添加您的 select 和 unselect 颜色，例如：

<color name="grey">#bfbfbf</color>
<color name="blue">#3F51B5</color>

Answer 6

您是否听说过 Roughike 的名为 BottomBar 的包装器项目，它使 BottomNavigationView 的使用更加容易？项目可以找到here。

我建议你使用这个项目，它是最新的并且有高水平的贡献。如果您参考使用它，您只需插入以下代码即可在单击选项卡时更改颜色并执行更多自定义操作：

TabLayout tabLayout = (TabLayout) findViewById(R.id.tabLayout);
Tab tab = newTab().setIcon(new BitmapDrawable(getResources(), icon)));
tab.getIcon().setColorFilter(Color.parseColor("#7E7E7E"), PorterDuff.Mode.SRC_IN);

tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
                          @Override public void onTabSelected(TabLayout.Tab tab) {
                            if (tab != null && tab.getIcon() != null) {
                              tab.getIcon().clearColorFilter();
                              }
                          }
                          @Override public void onTabUnselected(TabLayout.Tab tab) {
                            if (tab != null && tab.getIcon() != null) {
                              tab.getIcon()
                                  .setColorFilter(Color.parseColor("#7E7E7E"),
                                      PorterDuff.Mode.SRC_IN);
                            }
                          }
                          @Override public void onTabReselected(TabLayout.Tab tab) {
                          }
                        });
                      }
                    }
                  });

所以基本上我在这里所做的，我将未选择的标签着色为#7E7E7E，并清除所选标签的着色过滤器，以便它们以图标的原始颜色显示。当然，您也可以在选择时填充另一种颜色，这取决于您。

希望对您有所帮助！

干杯，

Renc

Answer 7

使用可绘制选择器的其他答案对我不起作用。

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

这在我的情况下有效，删除了state_checked="false"

<com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomnav"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/transparent_rect"
        app:layout_constraintBottom_toBottomOf="parent"
        app:itemIconTint="@drawable/bottomnav_selector"
        app:menu="@menu/bottomnav_menu"/>