Comment personnaliser le bouton de retour sur ActionBar


188

J'ai pu personnaliser l'arrière-plan de la barre d'action, l'image du logo et la couleur du texte en utilisant des suggestions parmi celles-ci:
Android: Comment changer l'icône ActionBar "Accueil" pour qu'elle soit autre chose que l'icône de l'application?
Couleur du texte
ActionBar Image d'arrière-plan ActionBar

La dernière pièce que je souhaite personnaliser est l'image du bouton de retour. C'est gris par défaut et je voudrais qu'il soit blanc. Changer la couleur, spécifier un dessin ou simplement le rendre transparent (et ajouter le chevron à mon image de logo personnalisée) fonctionnerait. Comment dois-je procéder?


1
Il n'y a pas de bouton RETOUR dans la barre d'action. Le bouton RETOUR est sur la barre système, ou n'est pas sur l'écran (pour les appareils avec un bouton RETOUR hors écran).
CommonsWare

1
@CommonsWare, je ne sais pas comment s'appelle le `` chevron gauche '' dans la barre d'action - mais c'est celui que j'appelle le bouton de retour. Je pense qu'il devrait remplacer le bouton de retour physique sur les appareils Android à l'avenir.
Sunil Gowda

13
Non et non. C'est l'indicateur "haut" (malgré l'orientation de la flèche). Vous l'activez via setDisplayHomeAsUpEnabled()sur ActionBar. Il n'est pas spécifiquement censé retourner simplement "en arrière". Cela signifie que le fait d'appuyer sur l'icône de l'application "montera" dans une hiérarchie plutôt que de revenir à l'activité précédente (comme le fait le bouton RETOUR sur la barre système).
CommonsWare

2
"Alors qu'en est-il des nouveaux appareils qui n'ont pas de bouton de retour physique, affichent-ils tous un bouton de retour" souple "" - ils devraient tous avoir un bouton de retour dans la barre système.
CommonsWare

3
je veux juste ajouter dans beaucoup de cas , le bouton UP WILL simplement revenir en arrière. Voir «Lorsque l'écran affiché précédemment est également le parent hiérarchique de l'écran actuel, le fait d'appuyer sur la touche Retour aura le même résultat que d'appuyer sur un bouton Haut - c'est une occurrence courante.» De developer.android.com/design/patterns /navigation.html
Dori

Réponses:


390

L'indicateur d'affordance "up" est fourni par un dessinable spécifié dans l' homeAsUpIndicatorattribut du thème. Pour le remplacer par votre propre version personnalisée, ce serait quelque chose comme ceci:

<style name="Theme.MyFancyTheme" parent="android:Theme.Holo">
    <item name="android:homeAsUpIndicator">@drawable/my_fancy_up_indicator</item>
</style>

Si vous prenez en charge la version antérieure à 3.0 avec votre application, assurez-vous de mettre cette version du thème personnalisé values-v11ou similaire.


10
fonctionne pour moi aussi. Je déclarais dans le jeu de styles comme mon ActionBarStyle comme dans AOSP sur github mais cela ne fonctionnait pas - passer au thème principal a fait l'affaire! +1
Dori

37
<item name="android:homeAsUpIndicator">@drawable/my_fancy_up_indicator</item>n'a pas fonctionné pour moi, mais a <item name="homeAsUpIndicator">@drawable/my_fancy_up_indicator</item>fait. Je suppose que c'est la version Android
Michał K

6
Existe-t-il un moyen de définir le rembourrage supérieur et inférieur pour cela à 0dp?
James McCracken

3
@JamesMcCracken la seule façon dont j'ai pu le faire était via une mise en page personnalisée.
greg7gkb

4
Quelqu'un a fait ce travail avec Navigation Drawer? Je suppose qu'il ActionBarDrawerToggleremplace l'indicateur up par l'un des siens, donc le mettre sur le style n'a aucun effet ...
Lucas Jota

89

Vous pouvez donc le modifier facilement par programme en utilisant la fonction homeAsUpIndicator () qui a été ajoutée dans l'API Android niveau 18 et supérieur.

ActionBar().setHomeAsUpIndicator(R.drawable.ic_yourindicator);

Si vous utilisez la bibliothèque de support

getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_yourindicator);


5
Si vous utilisez un tiroir, vous devez appeler drawerToggle.setDrawerIndicatorEnabled(false);avant de changer l'indicateur
Floss

2
@Floss Merci, setDrawerIndicatorEnabled (faux / vrai); résolu mon problème pour définir le bouton d'accueil comme cohérent «Retour» et (Ouvrir le tiroir / Fermer le tiroir) en fonction de mes besoins.
Ashraf Alshahawy

1
@Floss tiroirToggle.setDrawerIndicatorEnabled (false); ça marche pour moi :)
Contexte

30

J'ai vérifié la question. Voici les étapes que je suis. Le code source est hébergé sur GitHub: https://github.com/jiahaoliuliu/sherlockActionBarLab

Remplacez le style actuel des appareils antérieurs à la v11.

Copiez et collez le code suivant dans le fichier styles.xml du dossier des valeurs par défaut.

<resources>
    <style name="MyCustomTheme" parent="Theme.Sherlock.Light">
    <item name="homeAsUpIndicator">@drawable/ic_home_up</item>
    </style>
</resources>

Notez que le parent peut être remplacé par n'importe quel thème Sherlock.

Remplacez le style actuel des appareils v11 +.

Dans le même dossier où se trouvent les valeurs du dossier, créez un nouveau dossier appelé values-v11. Android recherchera automatiquement le contenu de ce dossier pour les appareils dotés d'une API ou supérieure.

Créez un nouveau fichier appelé styles.xml et collez le code suivant dans le fichier:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="MyCustomTheme" parent="Theme.Sherlock.Light">
    <item name="android:homeAsUpIndicator">@drawable/ic_home_up</item>
    </style>
</resources>

Notez que le nom du style doit être le même que le fichier dans le dossier des valeurs par défaut et qu'au lieu de l'élément homeAsUpIndicator, il s'appelle android: homeAsUpIndicator.

Le problème de l'élément est dû au fait que pour les appareils dotés de l'API 11 ou supérieure, la barre d'action Sherlock utilise la barre d'action par défaut fournie avec Android, dont le nom de clé est android: homeAsUpIndicator. Mais pour les appareils dotés de l'API 10 ou inférieure, Sherlock Action Bar utilise sa propre ActionBar, dont l'indicateur d'accueil en tant qu'indicateur de haut niveau est appelé simple «homeAsUpIndicator».

Utilisez le nouveau thème dans le manifeste

Remplacez le thème de l'application / activité dans le fichier AndroidManifest:

<application
    android:allowBackup="true"
    android:icon="@drawable/ic_launcher"
    android:label="@string/app_name"
    android:theme="@style/MyCustomTheme" >

2
Et vous pouvez essayer @ drawable / abc_ic_ab_back_holo_light ou @ drawable / abc_ic_ab_back_holo_dark si vous recherchez des icônes holo déjà disponibles.
Mason Lee

25

La modification de l'icône de navigation arrière diffère pour ActionBar et Toolbar.

Pour l' homeAsUpIndicatorattribut de remplacement ActionBar :

<style name="CustomThemeActionBar" parent="android:Theme.Holo">
    <item name="homeAsUpIndicator">@drawable/ic_nav_back</item>
</style>

Pour l' navigationIconattribut de remplacement de la barre d'outils :

<style name="CustomThemeToolbar" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="navigationIcon">@drawable/ic_nav_back</item>
</style>

19

J'ai fait le code ci-dessous onCreate()et travaillé avec moi

getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_yourindicator);

5

Si vous utilisez la barre d'outils, vous n'avez pas besoin de ces solutions. Il vous suffit de changer le thème de la barre d'outils

app:theme="@style/ThemeOverlay.AppCompat.Light"

app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"

Si vous utilisez une dark.actionBar, votre bouton de retour sera blanc sinon si vous utilisez le thème de la barre d'action claire, il sera noir.


Votre code fonctionne pour moi, mais pouvons-nous changer la couleur de cet indicateur?
Steve Luck

2
colorControlNormal et android: les valeurs textColorSecondary sont responsables de cela, mais je ne suis pas très sûr de ce que ces valeurs changent également. Vous pouvez vous essayer en définissant ces valeurs sur le thème de vos barres d'outils.
Oguz Ozcan

J'utilise "app: theme =" @ style / ThemeOverlay.AppCompat.Light "" pour afficher navigationIcon en arrière-plan blanc, mais il affiche l'icône grise par défaut, je dois le changer en bleu. "colorControlNormal et android: textColorSecondary" ne fonctionne pas.
Steve Luck

2
Utilisez un thème personnalisé qui a "ThemeOverlay.AppCompat.Light" comme parent. Cela pourrait fonctionner.
Oguz Ozcan

1
J'ai trouvé la solution pour changer l'icône de navigation, en utilisant name = "colorControlNormal" et non name = "android: colorControlNormal". Mais je veux passer à l'autre dessinable, peut-être?
Steve Luck

2

plateau ceci:

getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_close);

à l'intérieur onCreate();


Cela fonctionne mais comment revenir plus tôt bouton de retour
Nadimuddin

0

J'ai utilisé l'image back.png dans le fichier menifest.xml du projet. c'est bien de travailler en projet.

<activity
        android:name=".YourActivity"
         android:icon="@drawable/back"
        android:label="@string/app_name" >
    </activity>

0

J'ai eu le même problème de direction de l'icône du bouton Accueil de la barre d'action, à cause d'une mauvaise gestion de l'icône dans l'icône du répertoire Gradle Resource

comme dans le répertoire de ressources en arabe Gradle, vous mettez l'icône dans x-hdpi et dans la ressource en anglais Gradle, même nom d'icône que vous avez mis dans un dossier de densité différente comme xx-hdpi, de sorte que dans l'APK, il y ait deux mêmes noms d'icône dans différents répertoires, donc votre appareil sélectionnera l'icône dépendant de la densité peut être RTL ou LTR

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.