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

我添加了一个 BottomNavigationView到一个项目，我想有一个不同的文字(和图标色彩)颜色的选择标签(以实现灰色的非选择标签效果)。在颜色选择器资源文件中使用与 android:state_selected="true"不同的颜色似乎不起作用。我也尝试有额外的项目与 android:state_focused="true"或 android:state_enabled="true"条目，没有效果不幸。还尝试将 state_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_tab_item_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_nav_bar_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>

如果你能帮忙，我会很感激的。

170094 次浏览
小开

尝试对选择器项属性使用 android:state_enabled而不是 android:state_selected。

小开
最佳答案

在创建 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="@android:color/holo_blue_dark" />
<item android:color="@android:color/darker_gray"  />
</selector>

与 BottomNavigationBar一起使用的状态是 state_checked而不是 state_selected。

小开

1. Inside 保留意见 create file with name color (like draable)

右键单击颜色文件夹，选择 New-> color resource file-> create color. xml file (bnv _ tab _ item _ foreground) (图1: 文件结构)

3. 复制并粘贴 bnv _ tab _ item _ foreground

<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: 文件结构:

Figure 1: File Structure

小开

BottomNavigationView使用主题中的 原色应用于选中的选项卡，使用 用途 android:textColorSecondary应用于非活动选项卡图标色调。

因此，您可以创建一个具有首选主色的样式，并在 xml 布局文件中将其设置为 BottomNavigationView的主题。

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>

Your _ layout.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" />
小开

如果要以编程方式更改图标和文本颜色:

ColorStateList iconColorStates = new ColorStateList(
new int[][]{
new int[]{-android.R.attr.state_checked},
new int[]{android.R.attr.state_checked}
},
new int[]{
Color.parseColor("#123456"),
Color.parseColor("#654321")
});


navigation.setItemIconTintList(iconColorStates);
navigation.setItemTextColor(iconColorStates);
小开

这将奏效:

setItemBackgroundResource(android.R.color.holo_red_light)
小开

现在回答为时已晚，但可能对某人有帮助。 我正在做一个非常愚蠢的错误，我是使用一个选择器文件命名为 Bottom _ color _ nav. xml选择和非选择颜色变化，但仍然没有反映任何颜色的变化在 BottomNavigationView。

然后我意识到，我是在 OnNavigationItemSelected方法中返回 假的。如果在这个方法中返回 true，那么它将工作得很好。

小开

为了设置 textColor，BottomNavigationView有两个可以直接从 xml 设置的 样式属性:

  • itemTextAppearanceActive
  • itemTextAppearanceInactive

在 layout.xml 文件中:

<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/bnvMainNavigation"
style="@style/NavigationView"/>

在 styles.xml 文件中:

    <style name="NavigationView" parent="Widget.MaterialComponents.BottomNavigationView">
<item name="itemTextAppearanceActive">@style/ActiveText</item>
<item name="itemTextAppearanceInactive">@style/InactiveText</item>
</style>
<style name="ActiveText">
<item name="android:textColor">@color/colorPrimary</item>
</style>
<style name="InactiveText">
<item name="android:textColor">@color/colorBaseBlack</item>
</style>
小开

不是创建选择器, 创建样式的最佳方法。

<style name="AppTheme.BottomBar">
<item name="colorPrimary">@color/colorAccent</item>
</style>

以及更改选定或未选定的文本大小。

<dimen name="design_bottom_navigation_text_size" tools:override="true">11sp</dimen>
<dimen name="design_bottom_navigation_active_text_size" tools:override="true">12sp</dimen>

好好享受仿生人吧！

小开

我使用的是 com.google.android.material.bottomnavigation.BottomNavigationView(不同于 OP 的) ，我尝试了各种建议的解决方案上面，但唯一的工作是设置 app:itemBackground和 app:itemIconTint我的选择器颜色为我工作。

        <com.google.android.material.bottomnavigation.BottomNavigationView
style="@style/BottomNavigationView"
android:foreground="?attr/selectableItemBackground"
android:theme="@style/BottomNavigationView"
app:itemBackground="@color/tab_color"
app:itemIconTint="@color/tab_color"
app:itemTextColor="@color/bottom_navigation_text_color"
app:labelVisibilityMode="labeled"
app:menu="@menu/bottom_navigation" />

我的 color/tab_color.xml使用 android:state_checked

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

我也使用一个选定的状态颜色为 color/bottom_navigation_text_color.xml

enter image description here

这里并不完全相关，但为了完全透明，我的 BottomNavigationView风格如下:

    <style name="BottomNavigationView" parent="Widget.Design.BottomNavigationView">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">@dimen/bottom_navigation_height</item>
<item name="android:layout_gravity">bottom</item>
<item name="android:textSize">@dimen/bottom_navigation_text_size</item>
</style>
小开

随着文件夹结构的改变，tab _ color. xml 现在属于 res > draable，它可以处理选择器。从那时起，公认的解决方案就开始起作用了。


提交答案