Status bar overlaps toolbar on pre-lollipop but not on Lollipop / Marshmallow

Question

This is the issue I am encountering

On pre-lollipop devices I have the following issue

On Lollipop and Marshmallow devices everything appears fine

I am trying to create the translucent status bar effect when opening the navigation drawer. On Marshmallow and lollipop devices this is working fine.

Here is my code

activity_base.xml

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawerLayout"
    android:fitsSystemWindows="true"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/colorPrimary"
            android:minHeight="?attr/actionBarSize"
            android:theme="@style/ToolbarStyle"
            app:theme="@style/ToolbarStyle" />

        <FrameLayout
            android:id="@+id/activity_content"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </LinearLayout>

    <include layout="@layout/view_navigation_drawer_layout" />

</android.support.v4.widget.DrawerLayout>

view_navigation_drawer_layout.xml

<android.support.design.widget.NavigationView
    android:id="@+id/navigation"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fitsSystemWindows="true">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <include layout="@layout/nav_header" />

        <ListView
            android:id="@+id/lst_menu_items"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1" />
    </LinearLayout>
</android.support.design.widget.NavigationView>

Note that I do the above because of the answer to this question NavigationView and custom Layout

Notice that both layouts have the android:fitsSystemWindows="true"

I thought maybe its because I include the layout so I tried copying the whole layout into the activity layout. Did not help

I also have this styles xml file in my values-v19 directory (for KitKat and above)

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="AppTheme" parent="MaterialDesign">
        <item name="android:windowTranslucentStatus">true</item>
    </style>
</resources>

score 0 · Accepted Answer · answered Feb 08 '16 at 20:57

I made a solution to this issue. However, my solution requires a BaseActivity that hijacks the layout as stated in this blog post http://mateoj.com/2015/06/21/adding-toolbar-and-navigation-drawer-all-activities-android/

here is my code

public class BaseActivity extends AppCompatActivity {


    @Override
    public void setContentView(int layoutResID) {
        ViewGroup baseView = (ViewGroup) getLayoutInflater().inflate(R.layout.activity_base_with_drawer);
        FrameLayout activityContainer = (FrameLayout) baseView.findViewById(R.id.activity_content);
        getLayoutInflater().inflate(layoutResID, activityContainer, true);
        super.setContentView(layoutResID);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        if (useToolbar()) { //Does the activity have a toolbar?
            toolbar.setFitsSystemWindows(true); //toolbar will stretch underneath the status bar and because it naturally has a semi translucent background, it will assume a darker color of the toolbar which is usually the color primary.
            setSupportActionBar(toolbar); //Set the toolbar
            ActionBar actionBar = getSupportActionBar();
            if (actionBar != null) {
                actionBar.setDisplayHomeAsUpEnabled(true);
            }
        } else {
            toolbar.setVisibility(View.GONE);
            activityContainer.setFitsSystemWindows(true); //No toolbar so we set the container to have the fitsSystemWindow attribute to ensure contents do not overlay the system window such as status bar and navigation bar.
            TypedValue outValue = new TypedValue();
            boolean doesThemeHaveTranslucentWindow = getTheme().resolveAttribute(android.R.attr.windowIsTranslucent, outValue, true); //Check if the current activity theme has translucent window, this includes SearchActivity
            if (!doesThemeHaveTranslucentWindow) { //If it does not then set the container background to colour primary to have the same effect as the toolbar being there and avoid a white status bar. We do not want to do this for translucent windows otherwise they would not be see through
                activityContainer.setBackgroundColor(ContextCompat.getColor(this, R.color.colorPrimary));
            }
        }
    }

And this is the layout

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawerLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/colorPrimary"
            android:minHeight="?attr/actionBarSize"
            android:theme="@style/ToolbarStyle"
            app:theme="@style/ToolbarStyle" />

        <FrameLayout
            android:id="@+id/activity_content"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </LinearLayout>

    <include layout="@layout/view_navigation_drawer_layout" />

</android.support.v4.widget.DrawerLayout>

FitsSystemWindows is no longer set in any of the XML layouts. This is done in the setContentViewMethod of the BaseActivity class. If the activity does not have a toolbar, the activity container has the fitsSystemWindow attribute set to true otherwise, the toolbar has it applied.

If the activity does not have a toolbar, its container layout has a background colour set to the colour primary.

Why I do this is because when you set fitsSystemWindows on your toolbar it stretches underneath the status bar and because the status bar naturally has a semi translucent background, it will assume a darker color of the toolbar which is usually the color primary so we do this for the activity container to have the same effect.

Now there is a use-case I had in my app where I had an activity with a transparent window background which I check. If not true, the activity container has this colour set.

Not sure if its the best solution but its working well for me so far on Marshmallow, pre-lollipop and pre-KitKat too :P . Hope it helps out others.

Status bar overlaps toolbar on pre-lollipop but not on Lollipop / Marshmallow

1 Answers1