web-dev-qa-db-fra.com

Couleur de l'onglet sélectionné dans la vue de navigation inférieure

J'ajoute un BottomNavigationView à un projet et j'aimerais avoir une couleur de texte (et de nuance d'icône) différente pour l'onglet sélectionné (pour obtenir un effet de gris en onglets non sélectionnés). L'utilisation d'une couleur différente avec Android:state_selected="true" dans un fichier de ressources de sélecteur de couleur ne semble pas fonctionner. J'ai également essayé d'avoir des entrées d'élément supplémentaires avec Android:state_focused="true" ou Android:state_enabled="true", sans effet, malheureusement. Nous avons également essayé de définir l'attribut state_selected sur false (explicitement) pour la couleur par défaut (non sélectionnée), sans succès.

Voici comment j'ajoute la vue à ma mise en page:

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

Voici mon sélecteur de couleur (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>

Et ma ressource de menu (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>

J'apprécierais toute aide.

androidmaterial-designnavigationbar
106
Javad Sadeqzadeh

Lorsque vous créez un selector, conservez toujours l'état par défaut à la fin, sinon seul l'état par défaut serait utilisé. Vous devez réorganiser les éléments de votre sélecteur comme suit:

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

Et l'état à utiliser avec BottomNavigationBar est state_checked pas state_selected.

261
Kamran Ahmed

1. À l'intérieur res créez un dossier avec le nom de couleur (comme drawable)

2. Faites un clic droit sur le dossier de couleurs. Sélectionnez nouveau-> fichier de ressources de couleurs-> créer un fichier color.xml (bnv_tab_item_foreground) (Figure 1: Structure du fichier)

3. Copiez et collez 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>

Figure 1: Structure de fichier:

Figure 1: File Structure

35
Kishore Reddy

BottomNavigationView utilise colorPrimary à partir du thème appliqué pour l'onglet sélectionné et tiliseAndroid:textColorSecondary pour le onglet inactif teinte icône.

Vous pouvez donc créer un style avec la couleur primaire préférée et le définir comme thème de votre BottomNavigationView dans un fichier de présentation 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" />
32
dzikovskyy

Essayez d'utiliser Android:state_enabled plutôt que Android:state_selected pour les attributs d'élément de sélecteur.

2
Abtin Gramian

Si vous souhaitez modifier les couleurs des icônes et des textes par programme:

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);
1
EAMax

C'est trop tard pour la réponse mais utile pour tout le monde. Je faisais une erreur très stupide, j'utilisais bottom_color_nav.xml pour sélectionner et désélectionner le changement de couleur. Toujours pas obtenir la couleur appropriée dans BottomNavigation.

Puis je me suis rendu compte que j’étais retourné false dans onNavigationItemSelected Méthode qui a été émise uniquement avec mon code.

1
ajay singh Qualwebs

Cela fonctionnera:

setItemBackgroundResource(Android.R.color.holo_red_light)
0
KUNAL DAS