Lollipop draw behind statusBar with its color set to transparent

Question

I have set my statusBar color to transparent for Lollipop only with the following line in my theme     lt item name  android statusBarColor  gt  android color transparent lt  item gt    Now I need to draw behind it  but I can t get any view draw behind it  I know how to do it with the windowTranslucentStatus property  but don t want to use this property since it will then ignore the color of the statusBar set to transparent

User · Answer

The accepted answer worked for me using a CollapsingToolbarLayout. It's important to note though, that setSytstemUiVisibility() overrides any previous calls to that function. So if you're using that function somewhere else for the same view, you need to include the View.SYSTEM_UI_FLAG_LAYOUT_STABLE and View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN flags, or they will be overridden with the new call.

This was the case for me, and once I added the two flags to the other place I was making a call to setSystemUiVisibility(), the accepted answer worked perfectly.

User · Answer

The solution from Cody Toombs almost did the trick for me  I m not sure if this is Xamarin related or not  but I now have an acceptable solution     This is my setup   I have an Android project where I have referenced the Android Support v4 and v7 packages  I have two styles defined   values styles xml    lt  xml version  1 0  encoding  UTF-8    gt   lt resources gt       lt style name  MyStyle  parent   style Theme AppCompat Light NoActionBar  gt           lt item name  android windowTranslucentStatus  gt true lt  item gt       lt  style gt   lt  resources gt    values-v21 styles xml    lt  xml version  1 0  encoding  UTF-8    gt   lt resources gt       lt style name  MyStyle  parent   style Theme AppCompat Light NoActionBar  gt           lt item name  android statusBarColor  gt  android color transparent lt  item gt       lt  style gt   lt  resources gt    AndroidManifest targets  MyStyle    AndroidManifest xml    lt  xml version  1 0  encoding  utf-8   gt   lt manifest xmlns android  http   schemas android com apk res android  android versionCode  1  android versionName  1 0  package  com agn test test  gt       lt uses-sdk android minSdkVersion  10    gt       lt application android allowBackup  true  android icon   mipmap icon  android label   string app name  android theme   style MyStyle  gt       lt  application gt   lt  manifest gt    And finally the code in the Main Activity    Activity  Label    Test   MainLauncher   true  Icon     mipmap icon    public class MainActivity   Activity       protected override void OnCreate  Bundle savedInstanceState                base OnCreate  savedInstanceState            SetContentView  Resource Layout Main             Resource Layout Main is just a regular layout  no additional flags  Make sure there is something in there like an imageView  so that you can see the overlay           var uiOptions    int Window DecorView SystemUiVisibility          uiOptions     int SystemUiFlags LayoutStable          uiOptions     int SystemUiFlags LayoutFullscreen          Window DecorView SystemUiVisibility    StatusBarVisibility uiOptions           Window AddFlags  WindowManagerFlags DrawsSystemBarBackgrounds             Notice that I set DrawsSystemBarBackgrounds flag  this makes all the difference  Window AddFlags  WindowManagerFlags DrawsSystemBarBackgrounds      I spent a lot of time getting it right  too much time in fact  Hopefully this answer helps anyone trying to achieve the same thing

User · Answer

Cody Toombs s answer lead to an issue that brings the layout behind the navigation bar  So what I found is using this solution given by  Kriti   here is the Kotlin code snippet for the same   if  Build VERSION SDK INT  gt   19  amp  amp  Build VERSION SDK INT  lt  21        setWindowFlag this  WindowManager LayoutParams FLAG TRANSLUCENT STATUS  true     if  Build VERSION SDK INT  gt   19        window decorView systemUiVisibility   View SYSTEM UI FLAG LAYOUT STABLE or View SYSTEM UI FLAG LAYOUT FULLSCREEN    if  Build VERSION SDK INT  gt   21        setWindowFlag this  WindowManager LayoutParams FLAG TRANSLUCENT STATUS  false      getWindow   setStatusBarColor Color TRANSPARENT     private fun setWindowFlag activity  Activity  bits  Int  on  Boolean         val win  Window   activity getWindow        val winParams  WindowManager LayoutParams   win getAttributes       if  on            winParams flags   winParams flags or bits       else           winParams flags   winParams flags and bits inv             win setAttributes winParams      You also need to add  android fitsSystemWindows  false    root view of your layout

User · Answer

You can use ScrimInsetFrameLayout   https   github com google iosched blob master android src main java com google samples apps iosched ui widget ScrimInsetsFrameLayout java  android fitsSystemWindows  true  should set on scrim layout

User · Answer

Here is the theme I use to accomplish this    lt style name  AppTheme  parent   android style Theme NoTitleBar  gt        lt  -- Default Background Screen -- gt       lt item name  android background  gt  color default blue lt  item gt       lt item name  android windowTranslucentStatus  gt true lt  item gt    lt  style gt

User · Answer

Instead of    lt item name  android statusBarColor  gt  android color transparent lt  item gt    Use the following    lt item name  android windowTranslucentStatus  gt true lt  item gt    And make sure to remove the top padding  which is added by default  on your  MainActivity  layout   Note that this does not make the status bar fully transparent  and there will still be a  faded black  overlay over your status bar

User · Answer

There is good library StatusBarUtil from  laobie that help to easily draw image in the StatusBar   Just add in your build gradle   compile  com jaeger statusbarutil library 1 4 0    Then in the Activity set   StatusBarUtil setTranslucentForImageView Activity activity  int statusBarAlpha  View viewNeedOffset    In the layout   lt  xml version  1 0  encoding  utf-8   gt   lt RelativeLayout 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 background   color white      android orientation  vertical  gt        lt ImageView         android layout alignParentTop  true          android layout width  match parent          android adjustViewBounds  true          android layout height  wrap content          android src   drawable toolbar bg   gt        lt android support design widget CoordinatorLayout         android id    id view need offset          android layout width  match parent          android layout height  match parent  gt            lt android support v7 widget Toolbar             android id    id toolbar              android layout width  match parent              android layout height   attr actionBarSize              android background   android color transparent              app popupTheme   style ThemeOverlay AppCompat Light              app theme   style ThemeOverlay AppCompat Dark ActionBar   gt            lt  -- Your layout code -- gt       lt  android support design widget CoordinatorLayout gt   lt  RelativeLayout gt    For more info download demo or clone from github page and play with all feature   Note  Support KitKat and above   Hope that helps somebody else

User · Answer

Similar to some of the solutions posted  but in my case I did the status bar transparent and fix the position of the action bar with some negative margin  if  Build VERSION SDK INT  gt   21        getWindow   setStatusBarColor Color TRANSPARENT       FrameLayout LayoutParams lp    FrameLayout LayoutParams  toolbar getLayoutParams        lp setMargins 0  -getStatusBarHeight    0  0       And I used in the toolbar and the root view  android fitsSystemWindows  true

User · Answer

Try this theme   lt style name  AppTheme  parent  Theme AppCompat Light DarkActionBar  gt       lt  -- Customize your theme here  -- gt       lt item name  windowActionBar  gt false lt  item gt       lt item name  windowNoTitle  gt true lt  item gt       lt item name  colorPrimaryDark  gt  android color transparent lt  item gt       lt item name  colorPrimary  gt  color md blue 200 lt  item gt       lt item name  android windowDrawsSystemBarBackgrounds  gt true lt  item gt       lt item name  android statusBarColor  gt  android color transparent lt  item gt       lt item name  android windowTranslucentStatus  gt true lt  item gt   lt  style gt    Be sure that  your layout set   android fitsSystemWindows  false

User · Answer

All you need to do is set these properties in your theme   lt item name  android windowTranslucentStatus  gt true lt  item gt   lt item name  android windowTranslucentNavigation  gt true lt  item gt

User · Answer

This worked for my case       Create Set toolbar as actionbar toolbar    Toolbar  findViewById R id toolbar   setSupportActionBar toolbar       Check if the version of Android is Lollipop or higher if  Build VERSION SDK INT  gt   21            Set the status bar to dark-semi-transparentish     getWindow   setFlags WindowManager LayoutParams FLAG TRANSLUCENT STATUS              WindowManager LayoutParams FLAG TRANSLUCENT STATUS           Set paddingTop of toolbar to height of status bar         Fixes statusbar covers toolbar issue     toolbar setPadding 0  getStatusBarHeight    0  0            A method to find height of the status bar public int getStatusBarHeight         int result   0      int resourceId   getResources   getIdentifier  status bar height    dimen    android        if  resourceId  gt  0            result   getResources   getDimensionPixelSize resourceId             return result        For more information about working with statusBars  youtube com watch v  mGDMVRO3iE

User · Answer

Method  1   To achieve a completely transparent status bar  you have to use statusBarColor  which is only available on API 21 and above  windowTranslucentStatus is available on API 19 and above  but it adds a tinted background for the status bar  However  setting windowTranslucentStatus does achieve one thing that changing statusBarColor to transparent does not  it sets the SYSTEM UI FLAG LAYOUT STABLE and SYSTEM UI FLAG LAYOUT FULLSCREEN flags  The easiest way to get the same effect is to manually set these flags  which effectively disables the insets imposed by the Android layout system and leaves you to fend for yourself   You call this line in your onCreate method   getWindow   getDecorView   setSystemUiVisibility      View SYSTEM UI FLAG LAYOUT STABLE       View SYSTEM UI FLAG LAYOUT FULLSCREEN     Be sure to also set the transparency in  res values-v21 styles xml    lt item name  android statusBarColor  gt  android color transparent lt  item gt    Or set the transparency programmatically   getWindow   setStatusBarColor Color TRANSPARENT     The good side to this approach is that the same layouts and designs can also be used on API 19 by trading out the transparent status bar for the tinted translucent status bar    lt item name  android windowTranslucentStatus  gt true lt  item gt    Method  2   If you only need to paint a background image under your status bar  instead of positioning a view behind it  this can be done by simply setting the background of your activity s theme to the desired image and setting the status bar transparency as shown in method  1  This was the method I used to create the screenshots for the Android Police article from a few months ago   Method  3   If you ve got to ignore the standard system insets for some layouts while keeping them working in others  the only viable way to do it is to work with the often linked ScrimInsetsFrameLayout class  Of course  some of the things done in that class aren t necessary for all scenarios  For example  if you don t plan to use the synthetic status bar overlay  simply comment out everything in the init   method and don t bother adding anything to the attrs xml file  I ve seen this approach work  but I think you ll find that it brings some other implications that may be a lot of work to get around   I also saw that you re opposed to wrapping multiple layouts  In the case of wrapping one layout inside of another  where both have match parent for height and width  the performance implications are too trivial to worry about  Regardless  you can avoid that situation entirely by changing the class it extends from FrameLayout to any other type of Layout class you like  It will work just fine

User · Answer

I had the same problem so i create ImageView that draw behind status bar API 19   Set custom image behind Status Bar gist github com  public static void setTransparent Activity activity  int imageRes        if  Build VERSION SDK INT  lt  Build VERSION CODES KITKAT            return               set flags     if  Build VERSION SDK INT  gt   Build VERSION CODES LOLLIPOP            activity getWindow   addFlags WindowManager LayoutParams FLAG DRAWS SYSTEM BAR BACKGROUNDS           activity getWindow   clearFlags WindowManager LayoutParams FLAG TRANSLUCENT STATUS           activity getWindow   addFlags WindowManager LayoutParams FLAG TRANSLUCENT NAVIGATION           activity getWindow   setStatusBarColor Color TRANSPARENT         else           activity getWindow   addFlags WindowManager LayoutParams FLAG TRANSLUCENT STATUS                 get root content of system window       ViewGroup rootView    ViewGroup    ViewGroup  activity findViewById android R id content   getChildAt 0          rootView setFitsSystemWindows true          rootView setClipToPadding true        ViewGroup contentView    ViewGroup  activity findViewById android R id content       if  contentView getChildCount    gt  1            contentView removeViewAt 1                 get status bar height     int res   activity getResources   getIdentifier  status bar height    dimen    android        int height   0      if  res    0          height   activity getResources   getDimensionPixelSize res           create new imageview and set resource id     ImageView image   new ImageView activity       LinearLayout LayoutParams params   new LinearLayout LayoutParams ViewGroup LayoutParams MATCH PARENT  height       image setLayoutParams params       image setImageResource imageRes       image setScaleType ScaleType MATRIX           add image view to content view     contentView addView image          rootView setFitsSystemWindows true

User · Answer

I will be adding some more information here  The latest Android developments have made it pretty easy to handle a lot of cases in status bar  Following are my observations from the styles xml   Background color  for SDK 21   as a lot of answers mentioned  lt item name  android windowTranslucentStatus  gt true lt  item gt   will make the status bar transparent and show in front of UI  Your Activity will take the whole space of the top  Background color  again for SDK 21    lt item name  android statusBarColor  gt  color your color lt  item gt  will simply give a color to your status bar  without affecting anything else  However  in later devices  Android M     the icons started coming in different shades  The OS can give a darker shade of gray to the icons for SDK 23     if you override your styles xml file in values-23 folder and add  lt item name  android windowLightStatusBar  gt true lt  item gt   This way  you will be providing your user with a more visible status bar  if your status bar has a light color  think of how a lot of google apps have light background yet the icons are visible there in a greyish color   I would suggest you to use this  if you are giving color to your status bar via point  2    In the most recent devices  SDK 29   comes with a system wide light and dark theme  controllable by the user  As devs  we are also supposed to  override our style file in a new values-night folder  to give user 2 different experiences  Here again  I have found the point  2 to be effective in providing the  background color to status bar   But  system was not changing the color of status bar icons for my app  since my day version of style consisted of lighter theme  this means that users will suffer from low visibility   white icons on lighter background  This problem can be solved by using the point  3 approach or by overriding style file in values-29 folder and using a newer api  lt item name  android enforceStatusBarContrast  gt true lt  item gt    This will automatically enforce the grayish tint to icons  if your background color is too light

User · Answer

With Android Studio 1 4  the template project with boiler plate code sets Overlay theme on your AppbarLayout and or Toolbar  They are also set to be rendered behind the status bar by fitSystemWindow attribute   true  This will cause only toolbar to be rendered directly below the status bar and everything else will rendered beneath the toolbar  So the solutions provided above won t work on their own  You will have to make the following changes    Remove the Overlay theme or change it to non overlay theme for the toolbar  Put the following code in your styles-21 xml file         android color transparent  Assign this theme to the activity containing the navigation drawer in the AndroidManifest xml file    This will make the Navigation drawer to render behind the transparent status bar

User · Answer

The Right solution is to Change a property in XML under your Activity tag to below style  It just works    android theme   style Theme AppCompat Light NoActionBar

[android] Lollipop : draw behind statusBar with its color set to transparent

Examples related to android

Examples related to android-ui

Examples related to android-5.0-lollipop