《Android》『Shape、Selector、layer-list』- 三種佈局資源檔的差異與交互內嵌的使用方式
《簡單介紹》
在前面的 Shape、Selector 以及 layer-list 文章中，我們已經知道了每種資源檔個別的定義與使用方式，功能如下 –
Shape – 自訂介面元件的形狀、顏色以及樣式
Selector – 設置按鈕在不同狀態下的背景圖片
layer-list – 定義多張圖片重疊的介面
但其實這些資源檔在實作時並不是那麼的獨立且分開使用的，舉例來說，當我們在自訂一個按鈕的時候，我們可以直接在 Selector 資源檔中，直接以內嵌的方式建立資源，透過 <Shape> 與 <layer-list> 定義每個 <item> 標籤狀態下的樣式，以下直接透過程式碼的方式做說明。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
<selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true"> //按鈕按下的狀態 <layer-list> //設定重疊圖片 <item android:bottom="8dp"> <shape android:shape="rectangle"> //設定形狀、顏色以及樣式 <solid android:color="#ffaaaaaa" /> </shape> </item> <item> <shape android:shape="rectangle"> //指定形狀類型，默認為rectangle <solid android:color="#2F90BD" /> //指定形狀的填充色 <padding android:bottom="12dp" android:left="12dp" android:right="12dp" android:top="12dp" /> //設定內容區域離邊界的間距 <corners android:radius="200dp" /> //設定圓角，只適用於 rectangle <stroke android:width="2dp" android:color="@android:color/darker_gray" android:dashGap="4dp" android:dashWidth="4dp" /> //設定描邊 </shape> </item> </layer-list> </item> <item> //按鈕預設狀態 <layer-list> <item android:bottom="8dp"> <shape> ... </shape> </item> <item> <shape> ... </shape> </item> </layer-list> </item> </selector> |
selector.xml
在這個例子中，我們自訂了一個名為 selector.xml 的資源檔，其中我們定義了兩個按鈕狀態，分別是預設狀態以及按鈕按下時的狀態，在每個狀態裡面，我們透過 <layer-list> 在其內部實現多個 <item>重疊的效果，並利用 <shape> 定義每個 <layer-list> 內部 <item> 的形狀、顏色以及樣式。
臉書留言
一般留言