Android自定義控件背景及其Drawable以實現扁平化

扁平化？

人們都說扁平化是從IOS和WindowsPhone那邊吹過來的邪風，但是不可否認：扁平化是我見過的最舒服、最自然的表現方式。從開發角度上來講，扁平化的設計可以使得我們從許多屏幕適配和尺寸調節的工作中解放出來（雖然只是那麼一點點），更加關注功能；而在在使用層面上，只要文化水平不是特別地低（沒有惡意），擬物化的那點提示作用也不是那麼明顯，當然這裡不是說擬物化不好，總之：相對於其他表現方式，扁平化碉堡了。

咱們也做一個扁平化

上面說了，扁平化的控件其實在開發中是非常容易的。這裡讓我們一起動手，實現下面這個效果（紅色部分為本文講解部分，藍色的你可以自行練習完成）：
上圖中所有的元素都很簡單，其本質都是一個帶有黑色邊框，無填充背景的View（Button（圖中1處），ViewGroup（圖種2處））。

為View（途中1處）定義一個扁平化的背景

從上面的分析可知，我們只需要給組件定義一個扁平化了的背景，並且在布局上盡量追求簡潔即可實現扁平化效果。下面是一個粗0.5dp、填充色為白色的背景： bordered_black_blue_bg.xml

如果有對Android中shape的使用不熟的朋友，可以參考下這位同學的總結或參考官方api文檔。

我們的設計中還包括：用戶點擊按鈕時，背景色變為藍色。所以，上面的drawable資源也僅僅是默認狀態下的顯示，下面我們再創建一個扁平化Button按下時的效果：

bordered_black_blue_bg_pressed.xml

接下來我們根據上面兩個drawable文件為Button建立一個selector對象。

為ViewGroup定義一個扁平化背景

觀察上圖2處可知，ViewGroup的背景和View在正常狀態下的背景是一致的。所以他們的drawable文件內容是一致的。 bordered_black_bg.xml

2處的那些小條目的布局文件：
view_info_item.xml

ListView的扁平化處理

根據上面的介紹，我們已經可以做出一個非常“帶感”的扁平化的按鈕了（或TextView、等等），為了使的圖種2處的這些小條目可以滾動並易於管理，我們把它放到ListView中，下面是上圖的布局文件： fragment_department_detail.xml

我們知道，ListView在默認情況下丑的一逼，而且還item之間還沒有間隔，簡直不忍直視~~~~~為了使得ListView也能趕上扁平化這股春風，我們需要對其進行配置。 android:divider="@null"，配置ListView內Item的間隔為@null，即——沒有間隔。
android:dividerHeight="@dimen/list_dirver_height"，配置分割的高度即——item之間的間隔“距離”。上面的xml中，間隔為5dp
為ListView填充自定義的數據，這裡就不說了，繼承一個BaseAdapter即可。啟動Activity也不說了，這裡是本次博文的源碼。 任何需要積分的下載都是耍（da）流（sha）氓（bi）。