Page MenuHomePhabricator

Make status bar transparent
Closed, DeclinedPublic

Assigned To
None
Authored By
scblr
Apr 29 2019, 8:46 AM
Referenced Files
F28854397: Screenshot_20190429-172040.png
Apr 29 2019, 3:26 PM
F28854399: Screenshot_20190429-172206.png
Apr 29 2019, 3:26 PM
F28849929: implementation.png
Apr 29 2019, 8:46 AM
F28849963: design copy.png
Apr 29 2019, 8:46 AM
F28849930: design.png
Apr 29 2019, 8:46 AM

Description

I noticed a difference in the status bar design vs implementation the other day. Can we make the status bar transparent on article pages? Making use of the entire height of the screen feels cleaner, more immersive and “full-screen“.

DesignvsImplementation
implementation.png (1×824 px, 1015 KB)
vs
design.png (1×824 px, 1 MB)
design copy.png (1×824 px, 1 MB)

Event Timeline

  • What happens when the user scrolls down past the lead image?
  • This is possible, but it's known to not work consistently on different manufacturers and/or APIs. This would add considerably more complexity, and would make QA much more difficult.

What happens when the user scrolls down past the lead image?

Good question, three options:

  1. Completely fade out when scrolling down (same behavior as @cooltey implemented for the app bar (T220532)
  2. It stays transparent
  3. Fade/animate to pure white (same color as now)

I’d prefer 1).

This is possible, but it's known to not work consistently on different manufacturers and/or APIs. This would add considerably more complexity, and would make QA much more difficult.

Interesting, what does “not work consistently“ mean exactly? Only compatible with newer certain Android versions? Is there a way to “progressively enhance“ the behavior, e.g. we use transparency for newer Android versions and we’d have a fallback (leave it as it is) for older ones? Or do yo mean it’s more of a hack?

Cheers & thx @Dbrant

Oh, just noticed that we already use a similar pattern in the app @Dbrant:

In the news

Screenshot_20190429-172040.png (2×1 px, 471 KB)

My lists

Screenshot_20190429-172206.png (2×1 px, 1 MB)

Check out this video to see the status bar animation in action

Interesting, what does “not work consistently“ mean exactly?

Certain manufacturers literally don't honor the behavior that we expect from the status bar. They could leave the status bar as opaque even though we request it to be transparent, they could change its background color even though we request a different color, etc. (Devices that have a "notch" are a different beast altogether)

A long time ago we actually had a transparent status bar, but then we switched away from it, since we were getting numerous reports of weird/annoying device-specific behavior related to the status bar not working as intended.

The already-working pattern that you linked is a very specific combination of components that is "standard" in the Android SDK (CoordinatorLayout + CollapsingToolbarLayout + RecyclerView) and is therefore tested to work across all devices and configurations. Whereas the article-reading workflow (WebView + custom components) is not standard, and would require implementation and testing on all configurations on our own.

Ok, thanks for the additional background infos @Dbrant. So in conclusion, you’d advise against implementing a transparent status bar because of issues you mentioned? If yes, feel free to close this task.

Cheers!