Google在2015的IO大會(huì)上，給我們帶來(lái)了更加詳細(xì)的Material Design設(shè)計(jì)規(guī)范，同時(shí)，也給我們帶來(lái)了全新的Android Design Support Library，Android Design Support Library的兼容性更廣，直接可以向下兼容到Android 2.2。
　　下面介紹design Libraay，部分內(nèi)容出自官方文檔。
　　英文原文： http://android-developers.blogspot.jp/2015/05/android-design-support-library.html
翻譯： http://www.jcodecraeer.com/a/anzhuokaifa/developer/2015/0531/2958.html
　　使用design，首先我們要先引入它的Libray包。如果使用AS開(kāi)發(fā)只需要在build.gradle文件里面添加：
compile 'com.android.support:design:23.2.0' 目前的最新版本是23.2.0

一 SnackBar
**

Snackbar

.make(parentLayout, R.string.snackbar_text, Snackbar.LENGTH_LONG)

.setAction(R.string.snackbar_action, myOnClickListener)

.show();
// <span style="color: #008000;">Don’t forget to show!

</span>

二 Navigation View
** [圖片上傳中。。。（2）]**
現(xiàn)在大多數(shù)的都存在側(cè)滑欄，NavigationView的使用，是側(cè)滑欄的設(shè)計(jì)更加簡(jiǎn)單，尤其是對(duì)于剛剛學(xué)習(xí)使用側(cè)滑欄的用戶，上面的側(cè)滑欄里面的內(nèi)容就是通過(guò)NavigationView添加的，我們可以吧NavigationView和DrawerLayout結(jié)合使用，來(lái)實(shí)現(xiàn)側(cè)滑效果。
[圖片上傳中。。。（3）]
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true">　　 <android.support.design.widget.NavigationView android:id="@+id/navigation_view" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="start" app:headerLayout="@layout/navigation_drawer_header" app:menu="@menu/navigation_drawer_menu" /> </android.support.v4.widget.DrawerLayout>
[圖片上傳中。。。（4）]

我們注意兩個(gè)屬性：app:headerLayout--控制側(cè)滑欄頭部的布局；app:menu 導(dǎo)航菜單的資源文件（也可以再運(yùn)行時(shí)配置），下面分別貼出兩個(gè)xml的碼：
navigation_drawer_header.XML ,用來(lái)設(shè)置側(cè)滑欄頭部的顯示布局，這里只是展示了一個(gè)圖片。
[圖片上傳中。。。（5）]
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="200dp" android:background="#512da8"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@mipmap/ic_launcher" android:layout_centerInParent="true" /></RelativeLayout>
[圖片上傳中。。。（6）]

navigation_drawer_menu.XML 用來(lái)設(shè)置側(cè)護(hù)欄的內(nèi)容部分。
[圖片上傳中。。。（7）]
<?xml version="1.0" encoding="utf-8"?><menu xmlns:android="http://schemas.android.com/apk/res/android"> <group android:checkableBehavior="single"> <item android:id="@+id/item_green" android:icon="@mipmap/ic_launcher" android:title="Green" /> <item android:id="@+id/item_blue" android:icon="@mipmap/ic_launcher" android:title="Blue" /> <item android:id="@+id/item_pink" android:icon="@mipmap/ic_launcher" android:title="Pink" /> </group> <item android:title="SubItems2"> <menu> <item android:id="@+id/subitem_01" android:icon="@mipmap/ic_launcher" android:title="SubItem01" /> <item android:id="@+id/subitem_02" android:icon="@mipmap/ic_launcher" android:title="SubItem02" /> <item android:id="@+id/subitem_03" android:icon="@mipmap/ic_launcher" android:title="SubItem03" /> </menu> </item></menu>
[圖片上傳中。。。（8）]

我們通過(guò)Navigation調(diào)用setNavigationItemSelectedListener，來(lái)對(duì)側(cè)滑欄每個(gè)item的點(diǎn)擊添加監(jiān)聽(tīng)，然后做自己想做的處理。

三 TextInputLayout：
　　在design中對(duì)默認(rèn)的EditText也進(jìn)行了升級(jí)，使用TextInputLayout將EditText封裝起來(lái)，注意：TextInputLayout一定要和EditText同時(shí)使用，不能單獨(dú)使用，默認(rèn)的EditText在使用之前一般我們會(huì)設(shè)置提示語(yǔ)，但是提示語(yǔ)在輸入一個(gè)字母的時(shí)候就隱藏了，我們使用TextInputLayout，可以將提示語(yǔ)添加在EditText輸入框的上方。這樣也起到了時(shí)刻提示用戶的作用。
　　具體添加代碼如下:
　　
[圖片上傳中。。。（9）]
<android.support.design.widget.TextInputLayout android:id="@+id/til_pwd" android:layout_width="match_parent" android:layout_height="wrap_content" > <android.support.design.widget.TextInputEditText android:id="@+id/edittext" android:layout_width="match_parent" android:layout_height="wrap_content" /> </android.support.design.widget.TextInputLayout>
[圖片上傳中。。。（10）]

然后在對(duì)應(yīng)界面內(nèi)設(shè)置 textInputLayout.setHint(”your hint");
這樣簡(jiǎn)單的幾行代碼就實(shí)現(xiàn)了如下效果，對(duì)應(yīng)TextInputLayout個(gè)人覺(jué)得用處不大，還是很少使用的。

FloatingActionButton
　　FloatActionButton是一個(gè)可以進(jìn)行點(diǎn)擊的圓形按鈕，如下所示：
　　

早XML文件中，我們可以通過(guò)設(shè)置FloatActionButton的src來(lái)設(shè)置里面的圖標(biāo)。因?yàn)镕loatActionButton繼承ImageView，所有我們可以使用ImagView里面的所有屬性。但是修改FloatActionButton的按鈕顏色和主題的colorAccent屬性使一致的。現(xiàn)在使用AS開(kāi)發(fā)的都知道，創(chuàng)建一個(gè)Blank Activity的時(shí)候在生成默認(rèn)布局時(shí)會(huì)生成一個(gè)FloatActionButton按鈕，一般情況下按鈕時(shí)在頁(yè)面的右下方，但是我們也可以自定義FlatActionButton的位置。

如上圖所示，我就是把button放在了一個(gè)卡片上面，我們可以設(shè)置下面這兩個(gè)屬性來(lái)實(shí)行此功能。
1
2

app:layout_anchor=
"@id/cardview1"

app:layout_anchorGravity=
"top|right"

app:layout_anchor屬性來(lái)指定FloatActionButton是固定在什么控件或者布局上的。后面的是依附控件的id.
　　app:layout_anchorGravity屬性指定相對(duì)于依附控件的位置。
四 TabLayout（選項(xiàng)卡）
　　designLibray提出TabLayout之前，我們實(shí)現(xiàn)切換功能時(shí)，一般會(huì)找一些第三方庫(kù)或者自己寫，Design的TabLayout實(shí)現(xiàn)了固定的選項(xiàng)卡中view的寬度平分，在使用TabLayout時(shí)，我們只需要在XML里面添加：
<android.support.design.widget.TabLayout android:id="@+id/tablayout" android:layout_width="match_parent" android:layout_height="wrap_content"> </android.support.design.widget.TabLayout>

然后在XML對(duì)應(yīng)的界面中添加代碼：
[圖片上傳中。。。（16）]
　　tabLayout.addTab(tabLayout.newTab().setText("全部"));　　tabLayout.addTab(tabLayout.newTab().setText("類別A"));　　tabLayout.addTab(tabLayout.newTab().setText("類別B"));　　tabLayout.addTab(tabLayout.newTab().setText("類別C"));　　tabLayout.setSelectedTabIndicatorColor(getResources().getColor(R.color.green));　　tabLayout.setSelectedTabIndicatorHeight(8);　　tabLayout.setTabTextColors(Color.BLACK, getResources().getColor(R.color.green));
[圖片上傳中。。。（17）]

后面的Tab名稱自己根據(jù)需求添加，這里我就隨機(jī)起了幾個(gè)title。然后這樣實(shí)現(xiàn)的效果就是這樣滴：
　　

在代碼中，我們需要添加一個(gè)Adapter,在viewpager中加載內(nèi)容，我們今天在viewpager中添加Fragment，就創(chuàng)建一個(gè)FragmentPagerAdapter:******
[圖片上傳中。。。（21）] View Code
然后再調(diào)用下面代碼，就完成了，這樣TabLayout和ViewPager就可以結(jié)合使用了，是不是簡(jiǎn)單了很多呢o(^▽)o
Adapter adapter = new Adapter(getSupportFragmentManager());adapter.addFragment(Fragment1.newInstance("one"), "專題1");adapter.addFragment(Fragment1.newInstance("two"), "專題2");adapter.addFragment(Fragment1.newInstance("three"), "專題3");viewPager.setAdapter(adapter);tabLayout.setupWithViewPager(viewPager);

我們來(lái)看一下效果圖，就是這樣啦。
[圖片上傳中。。。（22）]
注：如果我們的Tab內(nèi)容不只是3,4個(gè)二是更多的時(shí)候，TabLayout提供了app:tabMode="scrollable"屬性，使TabLayout可以滑動(dòng)。

五 CoordinatorLayout
　　CoordinatorLayout可以看成是一個(gè)增強(qiáng)型的FramLayout，我們使用CoordinatorLayout可以實(shí)現(xiàn)很多新的操作。
　　1，CoordinatorLayout與FloatActionButton.
　　　我們吧FloatActionButton作為一個(gè)子View添加進(jìn)入CoordinationLayout中，在觸發(fā)FloatActionButton的時(shí)候在底部顯示出SnackBar,我們可以看到在SnackBar進(jìn)入界面的時(shí)候，F(xiàn)loatActionButton會(huì)自動(dòng)上移，這就是利用了CoordinationLayout提供的毀掉方法，并且在snackBar消失時(shí)回到原來(lái)的位置，并且不需要添加額外的代碼。
　　還有就是我們?cè)谏厦嫣岬降?，CoordinationLayout還提供了layout_anchor屬性和layout_anchorGravity一起使用，可以用于放置懸浮按鈕和其他view的相對(duì)位置。這個(gè)我們?cè)谏厦娴腇loatActionButton已經(jīng)提到了。
　　[圖片上傳中。。。（23）]
　　
　　2，CoordinatorLayout與AppBar。
　　　　我們看用MD寫的項(xiàng)目幾乎都有使用CoordinatorLayout和ToolBar一起使用實(shí)現(xiàn)的滾動(dòng)技巧。
　在添加此功能的時(shí)候我們需要添加一個(gè)滾動(dòng)組件，例如RecycleView，NestedScrollView and so on（ScrollView沒(méi)有效果）.所以我們可以添加一個(gè)這樣的布局：
　　
[圖片上傳中。。。（24）]
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <! -- Your Scrollable View --> <android.support.v7.widget.RecyclerView android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior" /> <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <android.support.v7.widget.Toolbar ... app:layout_scrollFlags="scroll|enterAlways"> <android.support.design.widget.TabLayout ... /> </android.support.design.widget.AppBarLayout></android.support.design.widget.CoordinatorLayout>
[圖片上傳中。。。（25）]

在上面的代碼中我們呢看到了屬性app:layout_scrollFlags，我們就是通過(guò)這個(gè)屬性來(lái)判斷控件是如何滾出屏幕與滾入屏幕
　Flag包括:
?、?scroll: 所有想滾動(dòng)出屏幕的view都需要設(shè)置這個(gè)flag- 沒(méi)有設(shè)置這個(gè)flag的view將被固定在屏幕頂部。
　②** enterAlways**: 這個(gè)flag讓任意向下的滾動(dòng)都會(huì)導(dǎo)致該view變?yōu)榭梢?jiàn)，啟用快速“返回模式”。
③ enterAlwaysCollapsed: 顧名思義，這個(gè)flag定義的是何時(shí)進(jìn)入（已經(jīng)消失之后何時(shí)再次顯示）。假設(shè)你定義了一個(gè)最小高度（minHeight）同時(shí)enterAlways也定義了，那么view將在到達(dá)這個(gè)最小高度的時(shí)候開(kāi)始顯示，并且從這個(gè)時(shí)候開(kāi)始慢慢展開(kāi)，當(dāng)滾動(dòng)到頂部的時(shí)候展開(kāi)完。
④ exitUntilCollapsed: 同樣顧名思義，這個(gè)flag時(shí)定義何時(shí)退出，當(dāng)你定義了一個(gè)minHeight，這個(gè)view將在滾動(dòng)到達(dá)這個(gè)最小高度的時(shí)候消失。
上面的布局文件中我們?cè)赗ecycleView中設(shè)置了屬性app:layout_behavior="@string/appbar_scrolling_view_behavior"，當(dāng)控件設(shè)置了這個(gè)屬性，就會(huì)觸發(fā)設(shè)置了app:layout_scrollFlags屬性的控件發(fā)生滑動(dòng)狀態(tài)的改變。
注意我們只是CoordinatorLayout和ToolBar舉例說(shuō)明這個(gè)功能，但是CoordinatorLayout也可以和其他控件實(shí)現(xiàn)此效果。這個(gè)我沒(méi)有自己寫例子，就貼上其他Demo的圖：
　　[圖片上傳中。。。（26）]

六 CollapsingToolbarLayout(可折疊的ToolBar)
　　從字面意思我們就知道這是個(gè)可折疊的ToolBar，使用CollapsingToolbarLayout的　　CollapsingToolbarLayout繼承FramLayout,CollapsingToolbarLayout包裹ToolBar的時(shí)候提供一個(gè)可折疊的ToolBar , 一般作為AppBarLayout的子視圖使用。
[圖片上傳中。。。（27）]
<android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="256dp" android:fitsSystemWindows="true" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> <android.support.design.widget.CollapsingToolbarLayout android:layout_width="match_parent" android:layout_height="match_parent" app:contentScrim="?attr/colorPrimary" app:title = "collapsingToolbarLayout" app:layout_scrollFlags="exitUntilCollapsed|scroll"> <ImageView android:id="@+id/imageview" android:layout_width="match_parent" android:layout_height="match_parent" android:scaleType="centerCrop" android:src="@mipmap/cheese_1" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" app:layout_collapseMode="pin" /> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout>
[圖片上傳中。。。（28）]

我們?cè)鏑ollapsingToolBarLayout中添加了一個(gè)ImageView和ToolBar, CollapsingToolBarLayout有以下幾個(gè)基本的屬性。
** app:title = ""**，設(shè)置的Title內(nèi)容在布局展開(kāi)的時(shí)候會(huì)變得大些，而在折疊的時(shí)候使字體過(guò)渡到默認(rèn)值，注意，我們的title是在CollapsingToolbarLayout上面設(shè)置的，而不是在ToolBar上面。
** app:contentScrim="?attr/colorPrimary" **設(shè)置這個(gè)屬性可以是布局在拉伸或者縮小到一定高度的時(shí)候漸變ToolBar的顏色，一般漸變的顏色選擇主題色，可以以自定義顏色。
** app:layout_collapseMode="" **這個(gè)屬性來(lái)設(shè)置子視圖折疊模式，有兩種pin:
固定模式：app:layout_collapseMode = "pin" 確保Toolbar在view折疊的時(shí)候最后固定在屏幕的頂部。
　 視差模式：app:layout_collapseMode = "parallax" 在折疊的時(shí)候會(huì)有個(gè)視差折疊的效果。

同時(shí)我們同時(shí)也設(shè)置了屬性app:layout_scrollFlags來(lái)設(shè)置滑動(dòng)方式，來(lái)響應(yīng)滾動(dòng)布局的
　　app:layout_behavior="@string/appbar_scrolling_view_behavior">屬性。來(lái)實(shí)現(xiàn)滾動(dòng)布局。
[圖片上傳中。。。（29）]
　　截圖很丑，下面貼上官方的例子：
　　[圖片上傳中。。。（30）]
　　
總結(jié)：
　　寫到這里support design Libray 里面的布局就差不多介紹完了，通過(guò)對(duì)design的使用感覺(jué)還是很人性化的，雖然有些效果的實(shí)現(xiàn)在網(wǎng)上有多的第三方庫(kù)也可以實(shí)現(xiàn)，但是畢竟這是google官方推出的，使用起來(lái)更加放心，但是有一個(gè)缺點(diǎn)就是部分控件封裝過(guò)于嚴(yán)重，所以只能在特定的布局或者要求下才能使用。