Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Status bar color stays without color when translucent status set to true

First, I want to mention that there is a huge amount of questions with various quality of answers and actually I cannot find a good explanation, reasoning and solution to the problem.

I want:

  1. A theme with windowTranslucentStatus=true
  2. Sometimes "draw" under the status bar (e.g. DrawerLayout)
  3. Sometimes "not draw" under the status bar and let the "components/system" to draw colorPrimaryDark instead of me. (and possibly android:fitsSystemWindows="true")

From various resources I've realized that there is a difference among root layouts, so all my trials are done with CoordinatorLayout that seems to be most appropriate and ready for this. (Directly from support library, included in all samples with toolbars, app bar layouts, etc.)

My current setup:

compile api 27, supports libs are versions 27*

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay"/>

    </android.support.design.widget.AppBarLayout>

    <fragment
        android:id="@+id/fragment"
        android:name="com.sygic.travel.materialtest5.MainActivityFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

</android.support.design.widget.CoordinatorLayout>

values/styles.xml:

<resources>
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>
    <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar"/>
    <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light"/>
</resources>

values-v21/styles.xml:

<resources>
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="android:windowTranslucentStatus">true</item>
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:statusBarColor">@color/colorPrimaryDark</item>
    </style>
</resources>

Which results in:

toolbar with status bar without color


Questions:

  1. Is it actually even possible to use windowTranslucentStatus and fitsSystemWindows and not to have "white/gray" status bar?
  2. It seems that there is some support for drawing status bar color in CoordinationLayout when fitsSystemWindows, but the (internal) property (for handling this) remains null, how to fix this? Or is it only for manual setting the status bar's color?
  3. In which case is style option android:statusBarColor taken in account? Which component uses this value? Why CoordinationLayout doesn't pick this config (with its default primaryColorDark) and use it?
  4. Is any of other layouts somehow supported? (Relative, Linear, Constraints) Are they actually recommended as root layouts when they have these (said) flaws?

Notes:

  • I prefer an "XML" solution
  • The issue is for example similar to Status Bar Color not changing with Relative Layout as root element but no variation/solution works for me.
like image 432
hrach Avatar asked Mar 28 '18 16:03

hrach


1 Answers

Ok, I tried to inspect the code and found this is solution! :yay:

First, some answers to my questions:

  1. Yes, it is. It's a responsibility of the app (views) to paint something. DrawerLayout does this automatically, CoordinatorLayout can too, see next.
  2. There is a property app:statusBarBackground which may be set directly on the xml tag on in the styles!
  3. Sorry, I don't know (yet! :))
  4. By quick code walk-through it doesn't seem that there is any support for drawing of the status bar.

So the solution is to use CoordinatorLayout and statusBarBackground property:

values-v21/styles.xml

<resources>
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="android:windowTranslucentStatus">true</item>
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:statusBarColor">@color/colorPrimaryDark</item>
    <item name="statusBarBackground">@color/colorPrimary</item>
</resources>
like image 168
hrach Avatar answered Nov 11 '22 19:11

hrach