本篇接著之前的Material Design控制項總結(一)往下學習support design包下其餘控制項,如果對Material Design不太熟悉的同學最好把第一篇看完再來看第二篇效果更好
本篇將介紹剩下的控制項FloatingActionButton
TabLayout
Snackbar
TextInputLayout
FloatingActionButton作為MD風格最具爭議的控制項,本篇將先學習他的簡單使用,然後再從日常app中FAB常見的兩種樣式入手進行介紹
FloatingActionButton是重寫ImageView的，所以FloatingActionButton擁有ImageView的一切屬性。
基本屬性
xml參數含義備註app:backgroundTintFAB的背景顏色有時候會出現點擊效果不顯示的情況，可以試試 加上 clickable = 「true」 這個屬性，應該是焦點未獲取到導致的
簡單使用
xml布局
至於點擊事件跟普通控制項並無差別這裡不過多說明
接下來將實現二個比較常見的效果
1.隨著appbar隱藏
這裡是在Material Design控制項總結(一)基礎上實現的也就是利用了Fab app:layout_anchor錨點的屬性將它與AppBarLayout關聯,然後隨著CollapsingToolbarLayout而隱藏,activity中並無其他代碼
2.隨著Recyclerview滑動而隱藏
相對於上面在Fab加一個屬性app:layout_behavior (至於這個是幹嘛的這裡先貼上一段介紹Behavior只有是CoordinatorLayout的直接子View才有意義。可以為任何View添加一個Behavior.Behavior是一系列回調。讓你有機會以非侵入的為View添加動態的依賴布局，和處理父布局(CoordinatorLayout)滑動手勢的機會。)後面有空再講解
這裡先上xml
其中ScrollAwareFABBehavior是我們自定義的一個Behavior。
TabLayout
以前我們在應用viewpager的時候，經常會使用TabPageIndicator來與其配合達到tab選項卡效果。但是畢竟是第三方庫用著總有點不放心,然而隨著support design包的到來谷歌終於為我們帶來了原生控制項tablayout,從此選項卡效果不在需要第三方就可以實現
基本屬性
屬性含義app:tabTextColorTab未被選中字體的顏色app:tabSelectedTextColortab被選中後，文字的顏色app:tabIndicatorColorTab指示器下標的顏色使用也非常簡單直接根據效果來看代碼好了
xml布局
除了使用上面介紹的屬性外，給viewpager加了一個app:layout_behavior=」@string/appbar_scrolling_view_behavior」 來實現當recyclerview下滑的時候隱藏toolbar,對這裡不是太理解的小夥伴可以在看看第一篇中關於CoordinatorLayout的部分應該就可以理解
activity中代碼
TabLayout只需調用setupWithViewPager()與viewpager關聯即可至於每個tab的title在viewpager的adapter中getPageTitle()設置即可
adapter代碼
除了上面簡單用法TabLayout常用的方法如下：
這裡解釋下setTabMode(int mode)方法,直接看效果就明白了
tabLayout.setTabMode(TabLayout.MODE_FIXED);
TabLayout.MODE_FIXED->tablayout直接顯示出所有title
tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
TabLayout.MODE_SCROLLABLE->tablayout在當前屏幕下能顯示多少就顯示多少title顯示不下的可以滑動tablayout查看
SnackbarSnackbar使用的時候需要一個控制項容器用來容納Snackbar.官方推薦使用CoordinatorLayout,因為使用這個控制項，可以保證Snackbar可以讓用戶通過向右滑動退出。並且Snackbar不會遮擋FAB的顯示了，當Snackbar出現時FAB會自動上移。
使用跟Toast類似
除了這樣之外Snackbar還可以支持一個按鈕
action按鈕顏色可以通過setActionTextColor()來設置,而彈出的message顏色很可惜沒有提供方法設置
不過我們可以看下setActionTextColor()源碼
可以發現是給mView中的Action按鈕的TextView設置顏色,經過繼續查看發現mView為Snackbar內部類SnackbarLayout而該內部類的布局為design_layout_snackbar_include接下來看該布局文件
是不是有點恍然大悟,哦原來就是一個普通的布局,那接下來思路就非常清晰了拿到id為snackbar_text的TextView然後setTextColor,經過查找發現沒有方法可以直接拿到該TextView,那我們就先拿到SnackbarLayout然後findviewbyid()
發現提供了getView()方法獲取到SnackbarLayout
那修改顏色就簡單了直接附上代碼
TextInputLayout該控制項是用於EditView輸入框的，主要解決之前EditView在獲得焦點編輯時hint屬性提示語消失，這一點在一個頁面有多個EditView輸入框的時候不是很好，因為很有可能用戶在輸入多個EditView之後，不知道當前EditView需要輸入什麼內容。為了解決這一問題，TextInputLayout就此誕生了。
TextInputLayout控制項和LinearLayout完全一樣，它只是一個容器。跟ScrollView一樣，TextInputLayout只接受一個子元素。子元素需要是一個EditText元素說，先上效果圖：
還真別說體驗感上了一個檔次,使用也非常簡單接下來看xml代碼
代碼也可以看出TextInputLayout包裹著EditView。
為了達到以上效果，我們還需添加如下錯誤提示代碼：
TextInputLayout 不僅能顯示提示語,而且還能把錯誤信息顯示在EditView之下。
TextInputLayout常用的方法有如下：
setHint()：設置提示語。
getEditText()：得到TextInputLayout中的EditView控制項。
setErrorEnabled():設置是否可以顯示錯誤信息。
setError()：設置當用戶輸入錯誤時彈出的錯誤信息。
另外需要注意下
setErrorEnabled開啟錯誤提醒功能。這直接影響到布局的大小，增加底部padding為錯誤標籤讓出空間。在setError設置錯誤消息之前開啟這個功能意味著在顯示錯誤的時候布局不會變化。
如果傳入非null參數的setError，那麼setErrorEnabled(true)將自動被調用。
TextInputLayout選中的顏色為主題中colorAccent屬性
到此SupportDesign控制項基本介紹完了.如有疑問歡迎討論
這是圓圓的第四次投稿，Material Design後半部就到這裡結束了額。歡迎大家留言討論，看到都會回額。
掃一掃關注微信公眾，每天都有不一樣的精彩！