CODEWITHSUNDEEP
androidandroid-layoutandroid-5.0-lollipopmaterial-design
Ben Pye
Ben Pye

Reputation: 807

Dark tinted status bar over navigation drawer

I have implemented a navigation drawer with material design as per How do I use DrawerLayout to display over the ActionBar/Toolbar and under the status bar? however because my drawer is white this causes issue with the status bar. The Google I/O 2014 application tints the status bar over the navigation drawer, how does it achieve this? I cannot find how in it's source code.

Upvotes: 3

Views: 796

Answers (1)

Daniel Veihelmann
Daniel Veihelmann

Reputation: 1477

The Google IO 2014 app uses a ScrimInsetsFrameLayout to tint the status bar (and the navigation drawer will cover the status bar). I highly recommend to use it I've tried a lot and it works best! ;-)

To get the ScrimInsetsFrameLayout to work you'll need to do four things:

1.) Add the ScrimInsetsFrameLayout class to your project.

2.) Use the ScrimInsetsFrameLayout as root-element of your drawer list in the xml-file of your activity. Important: Set android:fitsSystemWindows to true for both the DrawerLayout and the ScrimInsetsFrameLayout

3.) In your activity theme (-v21) xml add the line <item name="android:statusBarColor">@android:color/transparent</item>. (Otherwise, the 'normal' status bar will overlay the status bar of the ScrimInsetsFrameLayout.)

4.) In your activity, initialize the drawer and the DrawerLayout as usual, and then call drawerLayout.setStatusBarBackgroundColor(color) to color the status bar.

In the Google IO App, this is done in the setupNavDrawer() method of the BaseActivity

Upvotes: 2

Related Questions