สีของแท็บที่เลือกในมุมมองการนำทางด้านล่าง

ฉันกำลังเพิ่ม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>

ฉันอยากจะขอบคุณความช่วยเหลือใด ๆ.

ในขณะที่ทำการสร้าง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_checkedstate_selected

1.ภายในresสร้างโฟลเดอร์ที่มีสีชื่อ (เช่น drawable)

2.คลิกขวาที่โฟลเดอร์สี เลือก new-> color resource file-> สร้างไฟล์ color.xml (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: โครงสร้างไฟล์:

BottomNavigationViewใช้colorPrimaryจากธีมที่ใช้กับแท็บที่เลือกและใช้ android:textColorSecondaryสำหรับไอคอนแท็บที่ไม่ใช้งาน

ดังนั้นคุณสามารถสร้างสไตล์ด้วยสีหลักที่ต้องการและตั้งเป็นธีมให้กับคุณBottomNavigationViewในไฟล์เลย์เอาต์ xml

styles.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 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);

สายเกินไปที่จะตอบ แต่อาจมีประโยชน์สำหรับใครบางคน ฉันทำผิดพลาดไปมากฉันใช้ไฟล์ตัวเลือกชื่อว่าbottom_color_nav.xmlสำหรับการเลือกและไม่เลือกการเปลี่ยนสี แต่ก็ยังไม่ได้สะท้อนการเปลี่ยนแปลงสีใด ๆ ใน BottomNavigationView

จากนั้นฉันก็รู้ว่าฉันกลับเท็จในวิธีonNavigationItemSelected มันจะทำงานได้ดีถ้าคุณจะกลับมาจริงในวิธีนี้

ลองใช้android:state_enabledมากกว่าandroid:state_selectedสำหรับแอททริบิวรายการตัวเลือก

ฉันกำลังใช้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

ไม่เกี่ยวข้องทั้งหมดที่นี่ แต่เพื่อความโปร่งใสของฉัน 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>

ในการตั้งค่า textColor BottomNavigationViewมีคุณสมบัติสไตล์สองแบบที่คุณสามารถตั้งค่าได้โดยตรงจาก 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>

สิ่งนี้จะได้ผล:

setItemBackgroundResource(android.R.color.holo_red_light)

แทนที่จะสร้างตัวเลือกวิธีที่ดีที่สุดในการสร้างสไตล์

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

เพลิดเพลินกับ Android!