Xavier Yin

2015/04/28

Material DesignWidgets and Sample code

Outline

Getting Started

Material Theme

Tool Bar

RecyclerView and CardView

References

Getting Started

To create apps with material design:– Review the material design specification.

– Apply the material theme to your app.

– Create your layouts following material design guidelines.

– Specify the elevation of your views to cast shadows.

– Use system widgets for lists and cards.

– Customize the animations in your app.

App/build.gradle settings

Material Theme

Tool Bar and Drawer

Tool Bar– A Toolbar is a generalization of action bars for use within

application layouts.– An application may choose to designate a Toolbar as the action

bar for an Activity using the setActionBar() method.– Toolbar supports a more focused feature set than ActionBar.

A navigation button.  A branded logo image.  A title and subtitle.  One or more custom views. An action menu.

Tool Bar and Drawer

Tool Bar– Toolbar supports a more focused

feature set than ActionBar. A navigation button.  A branded logo image.  A title and subtitle.  One or more custom views. An action menu.

Tool Bar and Drawer

Creating Lists and Cards

RecyclerView widget – a more advanced and flexible version of ListView– for displaying large data sets

The RecyclerView class simplifies the display and handling of large data sets by providing:– Layout managers for positioning items– Default animations for common item operations, such as removal

or addition of items

Creating Lists and Cards

Creating Lists and Cards

CardView – show information inside cards

that have a consistent look across the platform.

– have shadows and rounded corners

References & Sample Code

Reference - Google– http://

www.google.com/design/spec/material-design/introduction.html

PPT & Sample Code– https://www.slideshare.net/secret/F6B0NsI9WpX5aI– https://github.com/xavier0507/MaterialDesignBasicWidgets.git