Màu của tab đã chọn trong Chế độ xem Điều hướng Dưới cùng

Tôi đang thêm một BottomNavigationViewdự án và tôi muốn có một màu văn bản (và màu biểu tượng) khác cho tab đã chọn (để đạt được hiệu ứng làm mờ các tab không được chọn). Sử dụng màu khác với android:state_selected="true"tệp tài nguyên bộ chọn màu dường như không hoạt động. Tôi cũng đã thử có các mục bổ sung với android:state_focused="true"hoặc android:state_enabled="true", không có tác dụng không may. Cũng đã thử đặt state_selectedthuộc tính thành false (rõ ràng) cho màu mặc định (không được chọn), không có may mắn.

Đây là cách tôi thêm chế độ xem vào bố cục của mình:

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

Đây là bộ chọn màu của tôi ( 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>

Và tài nguyên menu của tôi ( 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>

Tôi sẽ đánh giá cao sự giúp đỡ nào.

Trong khi thực hiện selector, luôn giữ trạng thái mặc định ở cuối, nếu không thì chỉ sử dụng trạng thái mặc định. Bạn cần sắp xếp lại các mục trong bộ chọn của mình dưới dạng:

<?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>

Và trạng thái được sử dụng BottomNavigationBarlà state_checkedkhông state_selected.

1. Bên trong res tạo thư mục với màu tên (như drawable)

2. Nhấp chuột phải vào thư mục màu. Chọn mới-> tệp tài nguyên màu-> tạo tệp color.xml (bnv_tab_item_forground) (Hình 1: Cấu trúc tệp)

3. Sao chép và dán bnv_tab_item_forground

<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_Forground:

 <?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>

Hình 1: Cấu trúc tệp:

BottomNavigationViewsử dụng colorPrimary từ chủ đề được áp dụng cho tab đã chọn và nó sử dụng android:textColorSecondary cho biểu tượng tab không hoạt động.

Vì vậy, bạn có thể tạo một kiểu với màu chính ưa thích và đặt nó làm chủ đề cho BottomNavigationViewtệp bố cục xml của bạn .

kiểu tệp :

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

Nếu bạn muốn thay đổi màu sắc của biểu tượng và văn bản theo chương trình:

ColorStateList iconsColorStates = 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")
            });

    ColorStateList textColorStates = 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(iconsColorStates);
    navigation.setItemTextColor(textColorStates);

Quá muộn để trả lời nhưng có thể hữu ích cho ai đó. Tôi đã mắc một lỗi rất ngớ ngẩn, tôi đang sử dụng tệp chọn có tên là bottom_color_nav.xml để chọn và bỏ chọn thay đổi màu nhưng vẫn không phản ánh bất kỳ thay đổi màu nào trong bottomNavlationView.

Sau đó, tôi nhận ra, tôi đã trả về false trong phương thức onNavulationItemSelected . Nó sẽ hoạt động tốt nếu bạn trở lại đúng trong phương pháp này.

Hãy thử sử dụng android:state_enabledthay vì android:state_selectedcho các thuộc tính mục chọn.

Để đặt textColor, BottomNavigationViewcó hai thuộc tính kiểu bạn có thể đặt trực tiếp từ xml:

• itemTextAppearanceActive
• itemTextAppearanceInactive

In your layout.xml file:

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

In your styles.xml file:

<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>

Tôi đang sử dụng com.google.android.material.bottomnavigation.BottomNavigationView(không giống như OP) và tôi đã thử nhiều giải pháp được đề xuất ở trên, nhưng điều duy nhất hiệu quả là cài đặt app:itemBackgroundvà app:itemIconTintmàu của bộ chọn của tôi hoạt động với tôi.

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

Công color/tab_color.xmldụng của tôiandroid: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>

và tôi cũng đang sử dụng màu trạng thái được chọn cho color/bottom_navigation_text_color.xml

Không hoàn toàn phù hợp ở đây nhưng để minh bạch đầy đủ, BottomNavigationViewphong cách của tôi như sau:

    <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>

Điều này sẽ làm việc:

setItemBackgroundResource(android.R.color.holo_red_light)

Thay vì tạo bộ chọn, Cách tốt nhất để tạo kiểu.

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

và để thay đổi kích thước văn bản, được chọn hoặc không được chọn.

<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>

Tận hưởng Android!