Wednesday, September 24, 2014

Android: Material Theme in Kitkat

Material Theme look and feel can be easily achieve in KitKat because of the new features Translucent UI in KitKat, where you have the ability to sit behind status and navigation bars

We can getting material theme look and feel in 2 ways.

1. We can write our own styles.xml and modify according to our needs.
2. Import SystemBarTint library and apply changes as per need.

First Approach using styles.xml:

We can build our own theme by setting with Translucent Theme in xml

If you are seeking more control over translucent decor, consider using a custom theme that extends something other than *.TranslucentDecor and use the following style properties in your theme:

 <item name="android:windowTranslucentStatus">true</item>  
 <item name="android:windowTranslucentNavigation">true</item>  

If your content does not need to be full bleed you can structure your layouts in such a way that the content will reside in an area of the screen that is not blocked by the status or navigation bar. To do this you would set android:fitsSystemWindows="true" on the content layout/view in your layout xml or in style.xml as
  <item name="android:fitsSystemWindows">true</item>.  
Add Some Color to the status bar, just set the windowBackground attribute in my theme.
 <item name="android:windowBackground">@color/window_bg</item>  

Second Approach Using SystemBarTine:

This library jgilfelt-SystemBarTint offers a simple way to create a background "tint" for the system bars. Internally even this library is depended on the Translucent  theme.

Source Code
You can download the source code by clicking here: MaterialThemeLookInKitKat.  This project is built using eclipse IDE. Unzip and import the project into Eclipse, it’s a good idea to use the Project by clean and rebuild from the project menu. This example is built using 2nd approach.


Thanks for reading :) 
Whether this post is helpful?

Have something to add to this post? If you have any other quick thoughts/hints that you think people will find useful? Share it in the comments.

1 comment :