Comment changer la couleur de la barre d'état pour qu'elle corresponde à l'application dans Lollipop? [Android]


96

Dans la nouvelle mise à jour Lollipop, j'ai remarqué qu'avec les applications Google natives, la couleur de la barre d'état change pour correspondre à la barre d'action de l'application que vous exécutez. Je vois que c'est également sur l'application Twitter, donc je suppose que ce n'est pas exclusivement Google qui peut le faire.

Est-ce que quelqu'un sait comment faire cela si c'est possible?

Réponses:


221

Pour changer la couleur de la barre d'état, utilisez setStatusBarColor (int color) . Selon le javadoc, nous devons également définir des drapeaux sur la fenêtre.

Extrait de code fonctionnel:

Window window = activity.getWindow();
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.setStatusBarColor(ContextCompat.getColor(activity, R.color.example_color));


Gardez à l' esprit selon matériel Consignes de conception couleur de la barre d'état et de l' action couleur de la barre doivent être différentes:

  • ActionBar doit utiliser la couleur primaire 500
  • StatusBar doit utiliser la couleur principale 700

Regardez la capture d'écran ci-dessous:

entrez la description de l'image ici


4
Notez que l'effet peut ne pas apparaître dans l'émulateur. Par exemple, cet exemple de projet teint la barre d'état sur un Nexus 9 mais pas sur un émulateur Android 5.0.
— CommonsWare

1
@mate: je faisais référence à l'émulateur Android SDK. Bon à savoir qu'il travaille sur Genymotion.
— CommonsWare

3
@Azad Non, ce n'est pas le cas. Pour utiliser l'extrait de code ci-dessus, vous devez vous assurer que votre appareil fonctionne sur l'API 21 ou une version ultérieure.
— klimat

1
Je travaille sur un projet relativement simple et je dois dire que je viens de l'utiliser getWindow().setStatusBarColor(activity.getResources().getColor(R.color.example_color));et cela a parfaitement fonctionné. Pas sûr du contexte dans lequel les drapeaux sont strictement nécessaires.
— Joaquin Iurchuk

3
Je veux également montrer la couleur dans les appareils pré-sucette. Comment ceci peut être fait?
— WISHY

48

Ajoutez simplement ceci dans votre style.xml. Le colorPrimary est pour la barre d'action et le colorPrimaryDark est pour la barre d'état.

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="android:colorPrimary">@color/primary</item>
    <item name="android:colorPrimaryDark">@color/primary_dark</item>
</style>

Cette image du développeur Android explique plus en détail la palette de couleurs. Vous pouvez en savoir plus sur ce lien .

entrez la description de l'image ici


Android Studio crée les entrées suivantes pour chaque projet: <color name="colorPrimary">#somecolor</color>et <color name="colorPrimaryDark">#somecolor</color>. Ils peuvent être modifiés pour obtenir l'effet souhaité.
— Neurotransmetteur

41

Une autre façon de définir la couleur de la barre d'état consiste à utiliser le fichier style.xml .

Pour ce faire, créez un fichier style.xml dans le dossier res / values-v21 avec ce contenu:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="AppTheme" parent="android:Theme.Material">
        <!--   darker variant for the status bar and contextual app bars -->
        <item name="android:colorPrimaryDark">@color/blue_dark</item>
    </style>
</resources>

Edit: comme indiqué dans les commentaires, lorsque vous utilisez AppCompat, le code est différent. Dans le fichier res / values ​​/ style.xml, utilisez à la place:

<style name="Theme.MyTheme" parent="Theme.AppCompat.Light">   
    <!-- Set AppCompat’s color theming attrs -->
    <item name="colorPrimary">@color/my_awesome_red</item>
    <item name="colorPrimaryDark">@color/my_awesome_darker_red</item>
    <!-- Other attributes -->
</style>

1
Fait ça. Mais n'a pas fonctionné. Mais ensuite, j'utilise AppCompat au lieu de Material.
— Martin

3
@Martin Pour appcompat, utilisez colorPrimaryDark sans le préfixe android.
— Michiel

ne fonctionne pas non plus pour appcompat (testé au niveau 18)
— Mohammad Zekrallah

La couleur de la barre d'état ne fonctionnera que sur les appareils dotés du niveau d'API du système d'exploitation 21 et supérieur. De plus, dans votre manifeste, assurez-vous de ne pas remplacer ce style par des activités individuelles.
— Levon

pour inappbrowser comment changer la couleur de la barre de recherche de la même manière que la couleur de l'application
— R.Anandan

23

Pour définir la couleur de la barre d'état, créez un fichier style.xml dans le dossier res / values-v21 avec ce contenu:

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <style name="AppBaseTheme" parent="AppTheme">
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:statusBarColor">@color/blue</item>
    </style>

</resources>

il dit ne peut pas résoudre le symbole windowDrawsSystemBarBackgrounds
— jmhostalet

4

Ajoutez cette ligne dans le style de v21 si vous utilisez deux styles.

  <item name="android:statusBarColor">#43434f</item>

Cela ne fonctionne pas sans définir le drapeauandroid:windowDrawsSystemBarBackgrounds
— Slav

4

De plus, si vous voulez une status-barcouleur différente pour différentes activités ( fragments ), vous pouvez le faire avec les étapes suivantes (travailler sur l'API 21 et plus):

Commencez par créer values21/style.xmlet mettre le code suivant:

 <style name="AIO" parent="AIOBase">
            <item name="android:windowDrawsSystemBarBackgrounds">true</item>
            <item name="android:windowContentTransitions">true</item>
    </style>

Ensuite, définissez les thèmes Blanc | Sombre values/style.xmlcomme suit:

 <style name="AIOBase" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">@color/color_primary</item>
        <item name="colorPrimaryDark">@color/color_primary_dark</item>
        <item name="colorAccent">@color/color_accent</item>
        <item name="android:textColorPrimary">@android:color/black</item>
        <item name="android:statusBarColor" tools:targetApi="lollipop">@color/color_primary_dark
        </item>
        <item name="android:textColor">@color/gray_darkest</item>
        <item name="android:windowBackground">@color/default_bg</item>
        <item name="android:colorBackground">@color/default_bg</item>
    </style>


    <style name="AIO" parent="AIOBase" />

    <style name="AIO.Dark" parent="AIOBase">
        <item name="android:statusBarColor" tools:targetApi="lollipop">#171717
        </item>
    </style>

    <style name="AIO.White" parent="AIOBase">
        <item name="android:statusBarColor" tools:targetApi="lollipop">#bdbdbd
        </item>
    </style>

N'oubliez pas non plus d'appliquer des thèmes dans votre fichier manifest.xml.


2

Dans les appareils Android pré Lollipop, vous pouvez le faire à partir de SystemBarTintManager Si vous utilisez Android Studio, ajoutez simplement Systembartint lib dans votre fichier gradle.

dependencies {
    compile 'com.readystatesoftware.systembartint:systembartint:1.0.3'
    ...
}

Puis dans votre activité

// create manager instance after the content view is set
SystemBarTintManager mTintManager = new SystemBarTintManager(this);
// enable status bar tint
mTintManager.setStatusBarTintEnabled(true);
mTintManager.setTintColor(getResources().getColor(R.color.blue));
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.