CODEWITHSUNDEEP
androidandroid-navigationandroid-statusbar
codercat
codercat

Reputation: 23291

How to change the status bar color in Android?

First of all it's not a duplicate as in How to change the background color of android status bar

How do I change the status bar color which should be same as in navigation bar.

I want the status bar color to be same as the navigation bar color

enter image description here

Upvotes: 578

Views: 1171023

Answers (30)

Safeer
Safeer

Reputation: 1467

If someone is looking to do the same in Jetpack Compose based UI, then this is one possible solution using accompanist library.

val systemUiController = rememberSystemUiController()
systemUiController.setSystemBarsColor(color = colorResource(R.color.your_color))

Upvotes: 0

Ibrahim Zulfiqar
Ibrahim Zulfiqar

Reputation: 218

2024 - using WindowInsetsControllerCompat

Provide simple controls of windows that generate insets. For SDKs >= 30, this class is a simple wrapper around WindowInsetsController. For lower SDKs, this class aims to behave as close as possible to the original implementation.

fun Activity.setSystemBarAppearance(
    statusBarColor: Int,
    navigationBarColor: Int,
    isAppearanceLightStatusBars: Boolean,
    isAppearanceLightNavigationBars: Boolean
) {
        window.statusBarColor = getColorInt(statusBarColor)
        window.navigationBarColor = getColorInt(navigationBarColor)
        val windowInsetController = WindowCompat.getInsetsController(window, window.decorView)
        windowInsetController.isAppearanceLightStatusBars = isAppearanceLightStatusBars
        windowInsetController.isAppearanceLightNavigationBars = isAppearanceLightNavigationBars
}

fun Context.getColorInt(id: Int) = ContextCompat.getColor(this, id)

Reference: WindowInsetsControllerCompat

Upvotes: 6

TexD
TexD

Reputation: 272

Solution: after lollipop version this code works for add this in if and call this in onCreate

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        Window window = this.getWindow();
        window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
        window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
        window.setStatusBarColor(this.getResources().getColor(R.color.blueColorPrimaryDark));
    }

Upvotes: 0

PRANAV SINGH
PRANAV SINGH

Reputation: 1190

For specific activity only use :

   Window window = this.getWindow();
   window.setStatusBarColor(this.getResources().getColor(R.color.red));

or in kotlin

window.statusBarColor = ContextCompat.getColor(this, R.color.red)

in onCreate of Activity.

For entire application update "colorPrimaryVariant" in themes.xml :

<style name="Theme.Demo" parent="Theme.MaterialComponents.DayNight.NoActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">@color/text_color</item>
        
        <!-- Primary brand color, used for status bar color   -->
        <item name="colorPrimaryVariant">@color/red</item>
  </style>

Upvotes: 3

Niels
Niels

Reputation: 9394

Place this is your values-v21/styles.xml, to enable this on Lollipop:

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light">
        <item name="colorPrimary">@color/color_primary</item>
        <item name="colorPrimaryDark">@color/color_secondary</item>
        <item name="colorAccent">@color/color_accent</item>
        <item name="android:statusBarColor">@color/color_primary</item>
    </style>
</resources>

Upvotes: 306

Carl M. Cartagena
Carl M. Cartagena

Reputation: 111

In kotlin I was able to resolve this using the following:

  window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS)
  window.statusBarColor = ContextCompat.getColor(this, android.R.color.transparent)

Upvotes: 0

Anh Duy
Anh Duy

Reputation: 1183

This solution only works on API >= 23. In API level 30 setSystemUiVisibility() has been deprecated. Hence you should use WindowInsetsControllerCompat as follows

fun changeColorStatusBar(color: Int = R.color.white) {
        val window: Window = window
        val decorView = window.decorView
        val wic = WindowInsetsControllerCompat(window, decorView)
        wic.isAppearanceLightStatusBars = true
        // And then you can set any background color to the status bar.
        window.statusBarColor = ContextCompat.getColor(this, color)
    }

Upvotes: 2

burak isik
burak isik

Reputation: 581

In the values/theme.xml, add the item that named name="android:statusBarColor".

 <resources xmlns:tools="http://schemas.android.com/tools">
        <style name="Theme.YourAppName" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
            ...
            ...
            ...
            <!-- Status bar color. -->
            <item name="android:statusBarColor" tools:targetApi="l">@color/purple_700</item>
        </style>
    </resources>

Upvotes: 1

Rehan Khan
Rehan Khan

Reputation: 1291

Java: Use this in the onCreate Method of the Activity

Window window = this.getWindow();
window.setStatusBarColor(this.getResources().getColor(R.color.main_screen_bg_color));

Kotlin:

window.statusBarColor = ContextCompat.getColor(this, R.color.colorName)

Upvotes: 5

Giorgio
Giorgio

Reputation: 13539

Android 5.0 Lollipop introduced Material Design theme which automatically colors the status bar based on the colorPrimaryDark value of the theme.

Note by realdognose: with Material Design library it will be colorPrimaryVariant

This is supported on device pre-lollipop thanks to the library support-v7-appcompat starting from version 21. Blogpost about support appcompat v21 from Chris Banes

enter image description here

Read more about the Material Theme on the official Android Developers website

Upvotes: 807

Moti Bartov
Moti Bartov

Reputation: 3592

Well, Izhar's solution was OK but personally, I try to avoid code that looks as this:

 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
//Do what you need for this SDK
};

But I don't like to duplicate code either. In your answer I have to add a line of code like below in all Activities:

setStatusBarColor(findViewById(R.id.statusBarBackground),getResources().getColor(android.R.color.white));

So, I took Izhar's solution and used XML to get the same result: Create a layout for the StatusBar status_bar.xml

<View xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="@dimen/statusBarHeight"
     android:background="@color/primaryColorDark"
     android:elevation="@dimen/statusBarElevation">

Notice the height and elevation attributes, these will be set in values, values-v19, values-v21 further down.

Add this layout to your activities layout using include, main_activity.xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/Black" >

<include layout="@layout/status_bar"/>
<include android:id="@+id/app_bar" layout="@layout/app_bar"/>
//The rest of your layout       
</RelativeLayout>

For the Toolbar, add top margin attribute:

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
android:background="@color/primaryColor"
app:theme="@style/MyCustomToolBarTheme"
app:popupTheme="@style/ThemeOverlay.AppCompat.Dark"
android:elevation="@dimen/toolbarElevation"
android:layout_marginTop="@dimen/appBarTopMargin"
android:textDirection="ltr"
android:layoutDirection="ltr">

</android.support.v7.widget.Toolbar>

In your appTheme style-v19.xml and styles-v21.xml, add the windowTranslucent attr:

styles-v19.xml, v21:

<resources>
<item name="android:windowTranslucentStatus">true</item>
</resources>

And finally, on your dimens, dimens-v19, dimens-v21, add the values for the Toolbar topMargin, and the height of the statusBarHeight: dimens.xml for less than KitKat:

<resources>
<dimen name="toolbarElevation">4dp</dimen>
<dimen name="appBarTopMargin">0dp</dimen>
<dimen name="statusBarHeight">0dp</dimen>
</resources>

The status bar height is always 24dp dimens-v19.xml for KitKat and above:

<resources>
<dimen name="statusBarHeight">24dp</dimen>
<dimen name="appBarTopMargin">24dp</dimen>
</resources>

dimens-v21.xml for Lolipop, just add the elevation if needed:

<resources>
<dimen name="statusBarElevation">4dp</dimen>
</resources>

This is the result for Jellybean KitKat and Lollipop:

enter image description here

Upvotes: 32

Husnain Qasim
Husnain Qasim

Reputation: 199

A very very old question. But for someone who wants to change status bar color from ANDROID 5.0, API 21 & above according to theme Dark and Light even Device DEFAULT. Put this code in your activity after super.onCreate(savedInstanceState); and before setContentView(R.layout.activity_main);

int currentNightMode = getResources().getConfiguration().uiMode & Configuration.UI_MODE_NIGHT_MASK;
    switch (currentNightMode) {
        case Configuration.UI_MODE_NIGHT_NO:
            // Night mode is not active on device
            // For WHITE status bar Icons color to dark
            Window window = getWindow();
            View view = window.getDecorView();
            new WindowInsetsControllerCompat(window, view).setAppearanceLightStatusBars(true);
            break;
        case Configuration.UI_MODE_NIGHT_YES:
            // Night mode is active on device
            break;
    }

And also in your style.xmlput this line <item name="android:statusBarColor">@color/colorWhite</item>

Upvotes: 1

Sarvesh Hon
Sarvesh Hon

Reputation: 456

Call Method From Activity that you want to change status bar color.

blackIconStatusBar(this, R.color.white);

Method Defination

public static void blackIconStatusBar(Activity activity, int color) {

    activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
    activity.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
    activity.getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_FULLSCREEN);
    activity.getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR);
    activity.getWindow().setStatusBarColor(ContextCompat.getColor(activity, color));
}

Upvotes: 0

ItSNeverLate
ItSNeverLate

Reputation: 759

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
    <!-- Primary brand color. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorPrimaryVariant">@color/colorPrimaryDark</item>
    <item name="colorOnPrimary">@color/white</item>
    <!-- Secondary brand color. -->
    <item name="colorOnSecondary">@color/black</item>
    <!-- Status bar color. -->
    <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
    <!-- Customize your theme here. -->
</style>

Notice: set colorPrimaryVariant

Upvotes: 1

Rubaiyat Jahan Mumu
Rubaiyat Jahan Mumu

Reputation: 4127

Just add these lines in your styles.xml file

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- This is used for statusbar color. -->
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <!-- This is used for statusbar content color. If statusbarColor is light, use "true" otherwise use "false"-->
    <item name="android:windowLightStatusBar">false</item>
</style>

Upvotes: 6

Ahmet B.
Ahmet B.

Reputation: 1684

If you want to set a custom drawable file use this code snippet

fun setCustomStatusBar(){
    if (Build.VERSION.SDK_INT >= 21) {
        val decor = window.decorView
        decor.viewTreeObserver.addOnPreDrawListener(object :
            ViewTreeObserver.OnPreDrawListener {
            override fun onPreDraw(): Boolean {
                decor.viewTreeObserver.removeOnPreDrawListener(this)
                val statusBar = decor.findViewById<View> 
                  (android.R.id.statusBarBackground)
                statusBar.setBackgroundResource(R.drawable.bg_statusbar)
                return true
            }
        })
    }
}

Upvotes: 1

Hamdy Abd El Fattah
Hamdy Abd El Fattah

Reputation: 1827

i used this code to change status bar to transparent

    activity?.window?.setFlags(
        WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS,
        WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS
    )

to change it to color in style used this code i used in fragment in onDetach()

activity?.window?.clearFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS)

Upvotes: 1

Faisal Shaikh
Faisal Shaikh

Reputation: 4157

For Java Developers:

As @Niels said you have to place in values-v21/styles.xml:

<item name="android:statusBarColor">@color/black</item>

But add tools:targetApi="lollipop" if you want single styles.xml, like:

<item name="android:statusBarColor" tools:targetApi="lollipop">@color/black</item>

For Kotlin Developers:

window.statusBarColor = ContextCompat.getColor(this, R.color.color_name)

Upvotes: 61

user13327428
user13327428

Reputation:

Solution is very Simple, put the following lines into your style.xml

For dark mode:

<item name="android:windowLightStatusBar">false</item>
<item name="android:statusBarColor">@color/black</item>

Upvotes: 7

Nabin
Nabin

Reputation: 1541

If you want to change the status bar color programmatically (and provided the device has Android 5.0). This is a simple way to change statusBarColor from any Activity and very easy methods when differents fragments have different status bar color.

 /**
 * @param colorId id of color
 * @param isStatusBarFontDark Light or Dark color
 */
fun updateStatusBarColor(@ColorRes colorId: Int, isStatusBarFontDark: Boolean = true) {
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
        val window = window
        window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS)
        window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS)
        window.statusBarColor = ContextCompat.getColor(this, colorId)
        setSystemBarTheme(isStatusBarFontDark)
    }
}

/** Changes the System Bar Theme.  */
@RequiresApi(api = Build.VERSION_CODES.M)
private fun setSystemBarTheme(isStatusBarFontDark: Boolean) {
    // Fetch the current flags.
    val lFlags = window.decorView.systemUiVisibility
    // Update the SystemUiVisibility depending on whether we want a Light or Dark theme.
    window.decorView.systemUiVisibility = if (isStatusBarFontDark) lFlags and View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR.inv() else lFlags or View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR
}

Upvotes: 11

ranojan
ranojan

Reputation: 837

To Change the color of the status bar go to res/values-v21/styles.xml and color of status bar

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light">
        <item name="colorPrimary">@color/color_primary</item>
        <item name="colorPrimaryDark">@color/color_secondary</item>
        <item name="colorAccent">@color/color_accent</item>
        <item name="android:statusBarColor">#0000FF</item>
    </style>
</resources>

Upvotes: 16

Amin Keshavarzian
Amin Keshavarzian

Reputation: 3963

To change the color for above lolipop just add this to your styles.xml

<item name="android:statusBarColor">@color/statusBarColor</item>

but remember, if you want to have a light color for the status bar, add this line too

<item name="android:windowLightStatusBar">true</item>

Upvotes: 42

codercat
codercat

Reputation: 23291

Update:

Lollipop:

public abstract void setStatusBarColor (int color)

Added in API level 21

Android Lollipop brought with it the ability to change the color of status bar in your app for a more immersive user experience and in tune with Google’s Material Design Guidelines.

Here is how you can change the color of the status bar using the new window.setStatusBarColor method introduced in API level 21.

Changing the color of status bar also requires setting two additional flags on the Window; you need to add the FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS flag and clear the FLAG_TRANSLUCENT_STATUS flag.

Working Code:

import android.view.Window;

...

Window window = activity.getWindow();

// clear FLAG_TRANSLUCENT_STATUS flag:
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);

// add FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS flag to the window
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);

// finally change the color
window.setStatusBarColor(ContextCompat.getColor(activity,R.color.my_statusbar_color));

Offcial developer reference : setStatusBarColor(int)

Example :material-design-everywhere

Chris Banes Blog- appcompat v21: material design for pre-Lollipop devices!

enter image description here

The transitionName for the view background will be android:status:background.

Upvotes: 454

Steve Moretz
Steve Moretz

Reputation: 3168

You can use this simple code:

One-liner in Kotlin:

window.statusBarColor = ContextCompat.getColor(this, R.color.colorName)

Original answer with Java & manual version check:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
    getWindow().setStatusBarColor(getResources().getColor(R.color.colorAccentDark_light, this.getTheme()));
} else if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    getWindow().setStatusBarColor(getResources().getColor(R.color.colorAccentDark_light));
}

Upvotes: 52

Engr Syed Rowshan Ali
Engr Syed Rowshan Ali

Reputation: 784

change the colorPrimaryDark to your desire color into the res/values/styles.xml file

    <resources>
        <color name="colorPrimary">#800000</color>
        <color name="colorPrimaryDark">#303F9F</color> //This Line
        <color name="colorAccent">#FF4081</color>
        <color name="red">#FF0000</color>
        <color name="white">#FFFFFF</color>
       <color name="cream">#fffdd0</color>
       <color name="burgundy">#800000</color>
    </resources>

Upvotes: 4

PhilipS
PhilipS

Reputation: 379

Edit the colorPrimary in the colors.xml in Values to the color you want the Status Bar to be. For example:

   <resources>
<color name="colorPrimary">#800000</color> // changes the status bar color to Burgundy
<color name="colorPrimaryDark">#303F9F</color>
<color name="colorAccent">#FF4081</color>
<color name="red">#FF0000</color>
<color name="white">#FFFFFF</color>
<color name="cream">#fffdd0</color>
<color name="burgundy">#800000</color>

Upvotes: 7

sajad abbasi
sajad abbasi

Reputation: 2184

You can change the status bar color with this function. works on android L means API 21 and higher and needs a color string such as "#ffffff".

private void changeStatusBarColor(String color){
    if (Build.VERSION.SDK_INT >= 21) {
        Window window = getWindow();
        window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
        window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
        window.setStatusBarColor(Color.parseColor(color));
    }
}

Upvotes: 20

DSoldo
DSoldo

Reputation: 989

I had this requirement: Changing programmatically the status bar color keeping it transparent, to allow the Navigation Drawer to draw itself overlapping the trasparent status bar.

I cannot do that using the API

getWindow().setStatusBarColor(ContextCompat.getColor(activity ,R.color.my_statusbar_color)

If you check here in stack overflow everyone before that line of code set the transparency of the status bar to solid with

getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS)

I'm able to manage color and transparency of status bar like this:

  • Android 4: there's not much you can do, because you can't manage status bar color from the API ... the only thing you can do is to set the status bar as translucent and move a colored element of you UI under the status bar. To do this you need to play with

    android:fitsSystemWindows="false"

    in your main layout. This allows you to draw you layout under the status bar. Then you need to play with some padding with the top of your main layout.

  • Android 5 and above: you have to define a style with

    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">@android:color/transparent</item>

    this allows the navigation drawer to overlap the status bar.

    Then to change the color keeping the status bar transparent you have to set the status bar color with

    drawerLayout.setStatusBarBackgroundColor(ContextCompat.getColor(activity, R.color.my_statusbar_color))

    where drawerLayout is defined like this

    <android.support.v4.widget.DrawerLayout
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

Upvotes: 15

Allan
Allan

Reputation: 211

If you want to work on Android 4.4 and above, try this. I refer to Harpreet's answer and this link. Android and the transparent status bar

First, call setStatusBarColored method in Activity's onCreate method(I put it in a util class). I use a image here, you can change it to use a color.

public static void setStatusBarColored(Activity context) {
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT)
    {
        Window w = context.getWindow();
        w.setFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS, WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
        int statusBarHeight = getStatusBarHeight(context);

        View view = new View(context);
        view.setLayoutParams(new FrameLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));
        view.getLayoutParams().height = statusBarHeight;
        ((ViewGroup) w.getDecorView()).addView(view);
        view.setBackground(context.getResources().getDrawable(R.drawable.navibg));
    }
}

public static int getStatusBarHeight(Activity context) {
    int result = 0;
    int resourceId = context.getResources().getIdentifier("status_bar_height", "dimen", "android");
    if (resourceId > 0) {
        result = context.getResources().getDimensionPixelSize(resourceId);
    }
    return result;
}

Before: before

After: after

The color of the status bar has been changed, but the navi bar is cut off, so we need to set the margin or offset of the navi bar in the onCreate method.

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
        LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(
                ViewGroup.LayoutParams.MATCH_PARENT, (int)(this.getResources().getDimension(R.dimen.navibar_height)));
        layoutParams.setMargins(0, Utils.getStatusBarHeight(this), 0, 0);

        this.findViewById(R.id.linear_navi).setLayoutParams(layoutParams);
    }

Then the status bar will look like this.

status bar

Upvotes: 7

lcompare
lcompare

Reputation: 997

Just create a new theme in res/values/styles.xml where you change the "colorPrimaryDark" which is the color of the status bar:

<style name="AppTheme.GrayStatusBar" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimaryDark">@color/colorGray</item>
</style>

And modify the activity theme in AndroidManifest.xml to the one you want, on the next activity you can change the color back to the original one by selecting the original theme:

<activity
    android:name=".LoginActivity"
    android:theme="@style/AppTheme.GrayStatusBar" >
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />

        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
</activity>

This is how your res/values/colors.xml should look like:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#c6d6f0</color>
    <color name="colorGray">#757575</color>
</resources>

Upvotes: 26

Related Questions