Changing the Status Bar aspect

Android has several ways to customize the status bar. Depending on the API version of the device in which our application is installed, the status bar will have some configuration options.

Coloring the status bar

Since Material Design theme was added in Android 5.0 (Lollipop), we have the option to change the color of the status bar to display the same colors of our application.

To do this, in our XML style must add the following lines:

<style name="MainAppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!--darker variant for the status bar and contextual app bars-->
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>


Colored status bar in Lollipop

 Turning transparent the Status bar

Android gives us the option to put the status bar as transparent in our application. In Lollipop, we get the status bar all transparent, but in Kitkat, Android will add a black transparency.

To achieve it, we must distinguish between the versions of Android 19 () and 21 (Lollipop)  because they use different ways to perform it. We have to create two new value folders for the api version 19 and 21.


In the main style XML stays as follow:

<style name="AppTheme" parent="MainAppTheme"/>
<!-- Base application theme. -->
<style name="MainAppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Your app branding color for the app bar -->
<item name="colorPrimary"&gt;@color/colorPrimary&lt;/item&gt;
<!-- Darker variant for the status bar and contextual app bars -->
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<!-- Theme UI controls like checkboxes and text fields -->
<item name="colorAccent">@color/colorAccent</item>

Two styles are defined in the main XML. ‘MainAppTheme’ style has the shared theme attributes and ‘MainAppTheme’ style has the unique attributes per API version.

The style XML created in the values-v21 folder  has:

&lt;style name="AppTheme" parent="MainAppTheme"&gt;
&lt;item name="android:statusBarColor"&gt;@android:color/transparent&lt;/item&gt;

The style XML created in the values-v21 folder has:

<style name="AppTheme" parent="MainAppTheme">
<item name="android:windowTranslucentStatus">true</item>

If we want to turn transparent the status bar, we have to add the following line in the onCreate method of each activity.


Black Transparent Status Bar in Kitkat


Transparent Status Bar in Lollipop

You can take a look in this repository of Github .


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s