Material Design

Material Design 
Material Design is a new Design language developed by google and announced at the Google I/O developer conference on June 25, 2014. Which replaces HOLO colors. With Which you can explore rich design for Android or Web Design. 
Android Material Design gives your basically three elements  
  1. A new theme. 
  1. New widgets for complex views. 
  1. New APIs for custom shadows and animations. 
 1. A new Theme :- 
There are two types of material theme Dark and Light 
Every material theme has :- 
  • ColorPrimary(Action Bar) 
  • ColorPrimaryDark(Upside of the Action bar, Shadow ,set black by default to non supportable device) 
  • TextColorPrimary(title of the action bar) 
  • WindowBackground(background of the activity) 
  • NavigationBarActivity(split action bar, set black color by default to non supportable devices). 
                                               Image 
2. Android New Widgets :  
  • RecyclerView (like ListView , provides more performance better accessibility ) 
The new RecyclerView widget is a more pluggable version of ListView that supports                                               different layout types and provides performance improvements. 
                                     Image 

  • CardView(more info on the image) 

                                                               Image 
  • Transparent Status Bar (Match shadow with device status bar ,avilable in 4.4 kitkat) in new version there is no any gradient , in 5.0 lollipop there is a colorPrimaryDark 
                          Image 

                            

3. New APIs for custom shadows and animations 
There are basically two things need to keep in mind surface and shadow when we are designing the layout. keep in mind that where should we use shadow and where to put controls on which surface. Choose color wisely, colors plays main role whether user will interact with your app or not. there is mainly two kind of colors, one is Primary and other is Action . for large area use lighter color like indigo(500) and for smaller are use darker color like indogo(700) , you can also use light blue(500) and pink (500). 

                                              Image 

Another main thing is coming picture to make a successful and well designed layout. we work on margins and key line when we are creating layouts.We know about margins, but here the new thing has come up that’s called KEYLINE, you will get to know better by following picture. 

                                             Image 

and last but not the least there is one interesting topic which u will love to learn , that is MOTION (Transition between screens ,Crucial part), which makes all the things together.  
  • First is Touch ripples:- 
touch ripple has come up with the very innovative and interesting idea. by pressing controls on the app , you will have a nice animation. 
  • second is Floating action buttons :- 
Floating action buttons are the action button which are making a motion when we are clicking on it, it changes to the right icon , and normally looks like plus button with some great effects 

                      Image 

How can we use material design in our app.(Usable in 4L Preview) 
  • your style.xml 
<resources>     <style name="AppTheme" parent="android:Theme.Material">         <!-- Customize the Material elements here -->     </style> </resources> 

  • And Apply your theme in Manifest.xml File 

<application android:theme="@style/AppTheme"> 

What you require to use Material Design in your app 
  • Android Lollipop 5.0 SDK 
  • Download following from SDK Manager 
  • - Intel x86 Emulator Accelerator(HAXM installer) 
After Installing Intel x86 Emulator Accelerator(HAXM installer) 
goto your SDK folder -> extras -> intel -> Hardware_Accelerated_Execution_Manager -> double click on intelhaxm-android application.  
  • then go to your SDK Manager and install  x86 atom system image (or atom_64) and Google APIs  named Intel X86 Atom_64 System Image,Intel X86 Atom System Image,Google APIs Intel X86 Atom_64 System Image,Google APIs Intel X86 Atom System Image 

  


Comments