Material Design Introduction

Material Designmaterial Design Introduction

Material Design is Google's new language, Google wants to send this to unify the user experience on various platforms, Material design is characterized by clean typography and simple layout to highlight the content.

Material Design has made recommendations for typography, materials, color matching, light efficiency, spacing, text size, interaction, and animation trajectories to help designers create applications that conform to Material style.

The Material design language encourages the use of vibrant vivid colors, and recommends the use of three tones in the same interface, and guarantees a strong hue that is generally at the bottom of the view, such as the status bar or Actionbar. It is easier to highlight the importance of content by making sharp contrasts with strong tones. For text color values, Material design suggests black on a light background and white on a dark background. Important information and headings are 87% transparent, secondary text is 54% transparent, and more minor explanatory text can be 26% transparent. For text that you want to highlight or click, use strong tones. Different levels of views can be highlighted by shading. For areas with operations and content highlighting, you can use CardView for isolation, and for areas where content is less important or operates in a single area, you can use split lines for isolation.

For more information, see the Material Design documentation:

Chinese version of website http://design.1sters.com/

English version http://www.google.com/design/spec/material-design/introduction.html

Material Design Uses

As our developer, the most concern is how to use the material design style in your project:

1. Set the targetSdkVersion and targetSdkVersion for 21 for the app
2. Create a style in the style resource file under the values directory to inherit from theandroid:Theme.Material
3. Specify the theme of the app in Androidmanifest or the theme of the activity for the style we set

Google official we offer three color style material design styles:

1. Black ThemeTheme.Material
2. Bright ThemeTheme.Material.Light
3. Bright Theme Black ActionbarTheme.Material.Light.DarkActionBar

We can also inherit the material design style provided by the system for color modification:

2. android:colorPrimaryDarkThe main dark hue of the app, statusbarcolor the color by default
4. android:statusBarColorstatus bar color, default using Colorprimarydark
6. android:colorPrimaryThe main hue of the app, actionbar the color by default
8. android:windowBackgroundWindow background Color
10. android:navigationBarColorBottom bar Color
12. android:colorForegroundApply foreground color, listview split line, switch slide area default to use this color
14. android:colorBackgroundApplied background color, the popmenu background uses that color by default
16. android:colorAccentThe selection effect of a general control is the default color
18. android:colorControlNormalDefault tint for controls
20. android:colorControlHighlightTint when the control is pressed
22. android:colorControlActivatedThe color of the control when it is selected, using Coloraccent by default
24. android:colorButtonNormalThe background color of the default button
26. android:textColorButton,textview's text color
28. android:textColorPrimaryDisableOnlyRadioButton the text of a control such as a checkbox
30. android:textColorPrimaryThe primary text color of the app, which is used by default for Actionbar title text

A theme can be used not only for Application and Activity use, but also for a single control, or to set the Android:theme property on a root node control in an XML layout to modify the theme of it and all its child controls. If we are going to make a custom modification to a particular control instance, we recommend that you set it up through the control's own API.

Material Design Compatibility

Material design themes are available only at the API level of 21 and are available in the V7 Support library with a Material design theme style for some controls, and if you want to make your app uniform in all versions of Android, We can customize the effects of controls or use some third-party compatibility packs. The most effective approach now is to create the VALUE-21 resource directory for version 21, use the material design style theme, and use the V7 Theme.AppCompat.Light style theme in other editions.

Material Design Introduction