Android Design Support Library使用详解
去年5月，百度贴吧就因对安全管理不到位，涉枪涉爆、贩卖公民个人信息、淫秽色情等违法信息问题突出被*部约谈。而近日，北京市网信办依法约谈百度执行总编辑，就百度贴吧存在严重违法和不良信息提出严厉批评并责令整改，要求全面清理有害信息，关闭相关违规账号，并已启动行政执法程序，依法予以查处。
作者简介本篇来自 Single Shu888 的投稿，展示了Material Design常用控件的用法，进阶部分基本都推荐了相关博文。文章篇幅不短，感兴趣的话要花点时间阅读了。
Single Shu888 的博客地址：
前言http://blog.csdn.net/sw5131899
Material Design 设计风格非常受欢迎，那么支持其效果的 Design Support Library（Android 2.1 API level 7及其以上）库又有哪些控件呢。主要包括 SnackBar、Navigation View、FloatActionbutton、CoordinatorLayout、CollapsingToolBarLayout 等。我在Git上看见一个非常炫的效果：
把该项目的Git附上，觉得有用的自行下载看源码：
https://github.com/frogermcs/InstaMaterial
现在来一一介绍Design系列控件。
SnackBar
SnackBar 是带有动画效果的快速提示栏，它显示在屏幕底部，是用来代替 Toast 的一个全新控件，它基本上继承了 Toast 的属性和方法，用户可以点击按钮执行对应的操作，Snackbar 支持滑动消失，如果没设任何操作，那么到时间自动消失。
SnackBar 的构造：
SnackBar 的常用方法：
Snackbar 需要一个控件容器view用来容纳，官方推荐使用 CoordinatorLayout 来确保 Snackbar 和其他组件的交互，比如滑动取消 Snackbar、Snackbar 出现时 FloatingActionButton 上移。举一个简单运用的例子：
这些运用都很简单，就不更多的嚼舌根了。有个花式使用SnackBar的连接，感兴趣的可以去看看:
http://www.jianshu.com/p/cd1e80e64311
TextInputLayout
TextInputLayout 主要作用是作为 EditText 的容器，从而为 EditText 默认生成一个浮动的 label，当用户点击了 EditText 之后，EditText 中设置的 Hint 字符串会自动移到 EditText 的左上角，使用非常简单。这有个例子写的不错：
http://www.jcodecraeer.com/a/basictutorial/2015/0821/3338.html
getEditText() 得到控件中包含的 EditText 控件
setError(CharSequence error) 设置错误信息并显示在 EditText 下方 应用场景：比如用户输错了密码或者用户名等
setHint(CharSequence hint) 设置提示信息
setErrorEnabled(boolean enabled) 设置 setError(CharSequence error) 这个函数是否可用 记住哦：这个函数一定要在 setError(CharSequence error) 这个函数之后执行哦！
部分示例xml
部分示例代码
效果图
TabLayout
TabLayout 控件用于应用中轻松的添加Tab分组功能，总共有两种类型可选。
1. 固定的Tabs：对应的xml配置中的 app:tabMode="fixed"
2. 可滑动的Tabs：对应xml配置中的 app:tabMode="scrollable"
TabLayout，它就可以完成 TabPageIndicator 的效果，而且还是官方的，最好的是它可以兼容到2.2以上版本，包括2.2。接下来就简单使用一下。
xml关键部分
适配器
用过 ViewPager 套 Fragment 的猿友都知道，就不啰嗦了。getPageTitle 是获取需要显示的 tab标题。新建一个 空的fragment BlankFragment。
那么准备工作差不多了，开始进入主题，基本的介绍都加了注释：
tabLayout.setupWithViewPager(viewPager,true); 这句代码是关联 viewpager 和 tabLayout。后面的 true 是是否自动刷新 fragment 的布尔值，看源码就知道了。
我们调用的第一个函数，实质是调用的第二个函数。这里需要注意的是需要先调用 viewpager 的 setAdaper 之后才能把 tabLayout 和 viewpager 关联起来。给个效果图:
NavigationView
以前做侧边栏的有 SlideMenu 三方库，这里不详细介绍了，想要了解的给个链接：
http://blog.csdn.net/luck_apple/article/details/9207811
现在有了 NavigationView 官方提供的，当然都渐渐使用这个了。官网地址也给出来，有空的可以去瞅瞅：
http://www.google.com/design/spec/patterns/navigation-drawer.html
使用导航视图需要传入一组参数，一个可选的头部布局，以及一个用于构建导航选项的菜单，完成这些步骤以后只需给导航选项添加响应事件的监听器就可以了。
在使用 NavigationView 时需要提前准备好两个xml文件，一个是头布局，一个是menu布局。menu的一些属性值是干嘛的，我相信有的猿友不是很清楚、下面简单介绍一下。
menu属性值介绍
元素（ELEMENTS）：<menu>
必须的。它必须是根节点，其中要包含 <item>、<group> 元素。
<menu>的属性：
xmlns:android
它定义了XML的命名空间，必须是：http://schemas.android.com/apk/res/android
元素（ELEMENTS）：<item>
它定义一个菜单项，可以包含一个 <menu>元素 作为子菜单。它必须是 <menu>、<group>元素 的子元素。
<item>的属性：
android:id
定义资源ID，它是个唯一值，使用“@+id/name”格式可以给这个菜单项创建一个新的资源ID，“+”号指示要创建一个新的ID。
android:title
字符串资源，它用字符串资源或原始的字符串来定义菜单的标题。
android:titleCondensed
字符串资源。它用字符串资源或原始的字符串来定义一个简要的标题，以便在普通的标题太长时来使用。
android:icon
可绘制资源，它定义了一个菜单项所要使用的图标。
android:onClick
方法名。在这个菜单项被点击时，会调用这个方法。在Activity中，这个方法必须用public关键字来声明，并且只接受一个MenuItem对象，这个对象指明了被点击的菜单项。这个方法会优先标准的回调方法：onOptionsItemSelected()。
警告：如果要使用ProGuard（或类似的工具）来混淆代码，就要确保不要重名这个属性所指定的方法，因为这样能够破坏功能。
这个属性在API级别11中被引入。
android:showAsAction
关键词。它定义这个项目作为操作栏中的操作项的显示时机和方式。只用Activity包含了一个ActionBar对象时，菜单项才能够作为操作项来显示。这个属性在API级别11中被引入，有效值如下：
android:actionViewLayout
它引用一个布局资源，这个布局要用于操作窗口。更多的信息请参照“操作栏”开发指南：
http://blog.csdn.net/fireofstar/article/details/7358393
这个属性在API级别11中被引入。
android:actionViewClass
类名。它定义了操作窗口要使用的View对象的完整的类名。例如，“android.widget.SearchView”说明操作窗口要使用的SearchView类。
警告：如果要使用ProGuard（或类似的工具）来混淆代码，就要确保不要重名这个属性所指定的方法，因为这样能够破坏功能。
这个属性在API级别11中被引入。
android:actionProviderClass
类名，它是操作项目所使用的ActionProvider类的完整的类名。例如，“android.widget.ShareActionProvider”说明要使用ShareActionProvider类。
警告：如果要使用ProGuard（或类似的工具）来混淆代码，就要确保不要重名这个属性所指定的方法，因为这样能够破坏功能。 这个属性在API级别14中被引入。
android:alphabeticShortcut
字符，定义一个字符快捷键
android:numericShortcut
数字值，定义一个数字快捷键
android:checkable
布尔值，如果菜单项是可以复选的，那么就设置为true。
android:checked
布尔值，如果复选菜单项默认是被选择的，那么就设置为true。
android:visible
布尔值，如果菜单项默认是可见的，那么就设置为true。
android:enabled
布尔值，如果菜单项目默认是可用的，那么就设置为true。
android:menuCategory
关键词。它的值对应了定义菜单项优先级的CATEGORE_*常量，有效值如下：
android:orderInCategory
整数值，它定义菜单项在菜单组中的重要性的顺序。
元素（ELEMENTS）：<group>
它定义了一个菜单组（它是一个具有共同特征的菜单项的组合，如菜单项的可见性、可用性或可复选性）。它要包含多个<item>元素，而且必须是<menu>元素的子元素。
<group>的属性
android:id
资源ID。它是资源的唯一标识。使用“@+id/name”格式给菜单项创建一个新的资源ID。“+”号指示应该给这个元素创建一个新的资源ID。
android:checkableBehavior
关键词。针对菜单组的可复选行为的类型。有效值如下：
android:visible
布尔值，如果菜单组是可见的，就设置为true。
android:enabled
布尔值，如果菜单组是可用的，就设置为true。
android:menuCategory
关键词。它的值对应了Menu类的CATEGORY_*常量，定义了菜单组的优先级。有效值如下：
android:orderInCategory
整数值，它定义了分类中菜单项目的默认顺序。
差不多就这些了，在res文件夹下创建一个名为 menu 的文件夹存放 menu的xml文件。取名为 draw_view.xml:
在创建一个头布局，命名为nav_header.xml:
好了，成功了一半，那么现在需要在 主xml文件 中布局使用 navigationView，最外层是需要DrawerLayout的。
这里我使用了一下百分比布局，防止有的产品经理有侧滑栏占屏幕的百分之多少多少之类的要求：
一些详细的介绍都写在了注释里，若还是有什么不懂的，可以参考这篇博客（介绍得比较详细）：
http://blog.csdn.net/lamp_zy/article/details/50126531
FloatingActionButton
浮动操作按钮实在 Material Design 准则中新引入的组件。用于强调当前屏幕最重要，高频率的一些操作。
FloatingActionButton 正常显示的情况下有个填充的颜色，有个阴影；点击的时候会有一个 rippleColor，并且阴影的范围可以增大，那么问题来了:
这个填充色以及rippleColor如何自定义呢？
默认填充颜色取的是 theme 中的 colorAccent，所以你可以在 style 中定义 colorAccent。
colorAccent 对应 EditText编辑时、RadioButton选中、CheckBox等选中时的颜色。详细请参考：
http://blog.csdn.net/lmj623565791/article/details/45303349
rippleColor 默认取的是theme中的colorControlHighlight。
我们也可以直接用属性定义这两个的颜色：
app:backgroundTint="#ff87ffeb"
app:rippleColor="#33728dff"
立体感有没有什么属性可以动态指定？
和立体感相关有两个属性，elevation 和 pressedTranslationZ，前者用户设置正常显示的阴影大小；后者是点击时显示的阴影大小。大家可以自己设置尝试下。
在5.x的设备上运行，你会发现一些问题（测试系统5.0）：
木有阴影
记得设置 app:borderWidth="0dp"。
按上述设置后，阴影出现了，但是竟然有矩形的边界（未设置margin时，可以看出）
需要设置一个margin的值。在5.0之前，会默认就有一个外边距（不过并非是margin，只是效果相同）。
so，良好的实践是：
添加属性app:borderWidth="0dp"
对于5.x设置一个合理的margin
写一个简单的使用例子：
由于没办法运行模拟器，就上个图片吧，app:rippleColor 这个是点击颜色，android:backgroundTint 这个是显示背景颜色。会有一个渐变的过程，可以试试。也可以参考鸿神的一篇介绍：
http://blog.csdn.net/lmj623565791/article/details/46678867
CoordinatorLayout
CoordinatorLayout 是 Design 引入的一个功能强大的布局，本质上是一个 增强的FrameLayout,它可以使得不同组件之间直接相互作用，并协调动画效果。我们可以定义 CoordinatorLayout 内部的视图组件如何相互作用并发生变化。
例如刚才的 FloatingActionButton 和 SnackBar，为了实现 SnackBar 出现时FAB能够上移，我们可以使用 CoordinatorLayout 为父容器。
然后在代码中，把 Coordinator 给 SnackBar：
Snackbar.make(coordinatorLayout,"点击了floatingActionButton",Snackbar.LENGTH_LONG).show();
这样就实现了简单的动画联动。这个是最简单的使用，等一下学了 CollapsingToolbarLayout和AppbarLayout 配合起来更华丽。
由于篇幅原因，详细说明可点击最后 阅读原文 查看，这里就放出最终效果图：
每天学习累了，看些搞笑的段子放松一下吧。关注最具娱乐精神的公众号，每天都有好心情。
如果你有好的技术文章想和大家分享，欢迎向我的公众号投稿，投稿具体细节请在公众号主页点击“投稿”菜单查看。
欢迎长按下图 -> 识别图中二维码或者扫一扫关注我的公众号：