Android Status Bar transparent when using AppTheme.NoActionBar

Question

When I apply the auto-generated AppTheme.NoActionBar to my activity via android:theme like so:

AndroidManifest.xml:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
          package="mypackage">

    <application
        ...
        android:theme="@style/AppTheme">

        <activity
            android:name=".MainActivity"
            android:theme="@style/AppTheme.NoActionBar" />

    </application>

</manifest>

My MainActivity is rendered with a transparent status bar at the top, which eventually has a white background, and white text over it. If the device is charging, that is the only symbol to be seen.

Transparent ActionBar from AppTheme.NoActionBar

Here is my values/styles.xml:

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>

    <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar"/>

    <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light"/>

</resources>

In the second style, you can see AppTheme.NoActionBar, which by default inherits AppTheme, however nowhere in either style specifies that the status bar should be transparent.

score 47 · Accepted Answer · answered Jun 03 '16 at 14:05

Chances are, if you've come across this issue, you have a folder called values-v21 and in it a file called styles.xml. This file defines styling for devices using API 21+ (Android 5.0+). This file will also most likely contain the following style named AppTheme.NoActionBar. Sound familiar?

values-v21/styles.xml:

<resources>
    <style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
    </style>
</resources>

AppTheme.NoActionBar was defined in the values/styles.xml provided in the question, which is still valid, however that file is only used for devices under API 21. If you look at the code, you can immediately identify the issue just by seeing the word transparent towards the very end. A little to the left and we see statusBarColor and voila. That's the issue. If you do not which to provide this styling for more up-to-date users you can simply remove that line of styling.

values-v21/styles.xml:

<resources>
    <style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    </style>
</resources>

And here's the result of that style removal:

Good ol' opaque status bar

@jsHate I believe it's just to introduce different styling across different generations. — SupaHam, Oct 05 '18 at 11:18
Can't believe I wasted good chunk of hours trying to figure out what's the issue. Thank you! — Stefano Mtangoo, Mar 14 '20 at 14:49

Android Status Bar transparent when using AppTheme.NoActionBar

1 Answers1