一、介紹：
就是圖片資源，而圖片資源又分成了10種不一樣的類別:
點陣圖(Bitmap File)、九宮格圖(Nine-Patch File)、圖層清單(Layer List)、狀態清單(State List)、等級清單(Level List)、轉換圖(Transition Drawable)、插入圖(Inset Drawable)、裁切圖(Clip Drawable)、縮放圖(Scale Drawable)、形狀圖(Shape Drawable)
二、點陣圖(Bitmap File)：
放在res/drawable/底下的檔案，支援png(推薦)、jpg(支援)、gif(不推薦)，也可以是XML文件
既然是XML檔，勢必會有規定的元素(Element)及屬性(Attribute):
元素:
<bitmap>
定義點陣圖的內容
屬性:
xmlns:android(String)
必須為"http://schemas.android.com/apk/res/android"，只有為根元素時才需要
android:src(Drawable Resource)*
圖片
android:antialias(boolean)
是否啟用抗鋸齒
android:dither(boolean)
如果圖片的像素配置與屏幕不同，是否啟用抖動(例如:RGB565的屏幕與ARGB8888的圖)
android:gravity(String)
定義圖片重心，代表放在容器中的位置，可以是以下值的其中一個或多個(多個以" | "隔開)
| 值 | 描述 |
| top | 放在頂部，不改變大小 |
| bottom | 放在底部，不改變大小 |
| left | 放在左邊緣，不改變大小 |
| right | 放在右邊緣，不改變大小 |
| center_vertical | 放在垂直中心，不改變大小 |
| fill_vertical | 如果需要，垂直填滿 |
| center_horizontal | 放在水平中心，不改變大小 |
| fill_horizontal | 如果需要，水平填滿 |
| center | 放在正中心，不改變大小 |
| fill | 如果需要，完全填滿 |
| clip_vertical | (備註1 |
| clip_horizontal | (備註1 |
android:mipmap(boolean)
是否啟用mipmap提示
android:tileMode(String)
定義圖塊模式，啟用圖塊模式時，圖片重心將被忽略
| 值 | 描述 |
| disabled(預設) | 不要啟用 |
| clamp | 如果著色器超出原始邊界，複製邊緣顏色 |
| repeat | 重複著色器圖像 |
| mirror | 重複著色器圖像，交替鏡像，以連接圖片 |
範例(來自Android官方文件):
<bitmap xmlns:android="http://schemas.android.com/apk/res/android" android:src="@drawable/icon" android:tileMode="repeat" /> |
三、九宮格圖(Nine-Patch File)：
一種png圖片，可以讓android知道當圖片過小時要從哪個部分延伸(詳細可以搜尋".9.png")，放在res/drawble/底下的.9.png檔案及xml檔案
既然是XML檔，勢必會有規定的元素(Element)及屬性(Attribute):
元素:
<nine-patch>
定義九宮格圖
屬性:
xmlns:android(String)*
android:src(Drawable Resource)*
android:dither(boolean)
以上三個屬性皆與點陣圖相同
範例(來自Android官方文件):
<nine-patch xmlns:android="http://schemas.android.com/apk/res/android" android:src="@drawable/myninepatch" android:dither="false" /> |
四、圖層清單(Layer List)：
圖層清單是一個圖片，叫做清單是因為它是由一系列圖片疊出來的圖片，放在res/drawble/底下的xml檔案
既然是XML檔，勢必會有規定的元素(Element)及屬性(Attribute):
元素:
<layer-list>*
必須為根元素，可以包含一個或多個<item>
屬性:
xmlns:android(String)*
必須是"http://schemas.android.com/apk/res/android"
<item>
定義一個圖片，可以放在內部<bitmap>
屬性:
android:drawable(Drawable Resource)*
圖片
android:id(Resource ID)
Drawable的唯一資源ID，用以表示這個<item>
android:top(int)
頂部偏移量(像素)
android:right(int)
右偏移量(像素)
android:bottom(int)
底部偏移量(像素)
android:left(int)
左偏移量(像素)
備註:預設會自動縮放至適合View的大小，如果要修改例如重心這種<item>未提供的屬性，可以使用<bitmap>
範例(來自Android官方文件):
| <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <bitmap android:src="@drawable/android_red" android:gravity="center" /> </item> <item android:top="10dp" android:left="10dp"> <bitmap android:src="@drawable/android_green" android:gravity="center" /> </item> <item android:top="20dp" android:left="20dp"> <bitmap android:src="@drawable/android_blue" android:gravity="center" /> </item> </layer-list> |
五、狀態清單(State List)：
可以依據元件狀態繪製不同圖片，類似顏色狀態列表，放在res/drawble/底下的xml檔案
既然是XML檔，勢必會有規定的元素(Element)及屬性(Attribute):
元素:
<selector>*
必須是根元素，包含一個或多個<item>
屬性:
xmlns:android(String)*
必須是"http://schemas.android.com/apk/res/android"
android:constantSize(boolean)
圖片尺寸是否因為狀態改變而維持不變，true維持不變，預設false
android:dither(boolean)
同點陣圖的dither
android:variablePadding(boolean)
填充狀態是否因為狀態改變而更改，true為更改填充狀態，預設false
<item>
定義圖片
屬性:
android:drawable(Drawable Resource)*
圖片
android:state_pressed(boolean)
按下時應用
android:state_focused(boolean)
聚焦時應用
android:state_hovered(boolean)
光標懸停時應用
android:state_selected(boolean)
使用navigation時應用
android:state_checkable(boolean)
元件可以勾選時應用
android:state_checked(boolean)
元件勾選時應用
android:state_enabled(boolean)
元件啟用時應用
android:state_activated(boolean)
元件激活為持久選擇時應用
android:state_window_focused(boolean)
元件的視窗聚焦時應用
範例(來自Android官方文件):
| <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true" android:drawable="@drawable/button_pressed" /> <!-- pressed --> <item android:state_focused="true" android:drawable="@drawable/button_focused" /> <!-- focused --> <item android:state_hovered="true" android:drawable="@drawable/button_focused" /> <!-- hovered --> <item android:drawable="@drawable/button_normal" /> <!-- default --> </selector> |
六、等級清單(Level List)：
可以管理多個圖像，每個圖像可以設置最大最小數值，使用setLevel()可以限制加載的級別(備註2，放在res/drawble/底下的xml檔案
既然是XML檔，勢必會有規定的元素(Element)及屬性(Attribute):
元素:
<level-list>
必須是根元素，包含一個或多個<item>
屬性:
xmlns:android(String)*
必須是"http://schemas.android.com/apk/res/android"
<item>
定義圖像的等級
屬性:
android:drwable(Drawable Resource)*
圖片
android:maxLevel(int)
最大值
android:minLevel(int)
最小值
範例(來自Android官方文件):
| <level-list xmlns:android="http://schemas.android.com/apk/res/android" > <item android:drawable="@drawable/status_off" android:maxLevel="0" /> <item android:drawable="@drawable/status_on" android:maxLevel="1" /> </level-list> |
七、轉換圖(Transition Drawable)：
可以定義一種圖像，讓這種圖像可以以兩個圖像進行淡入淡出，放在res/drawble/底下的xml檔案
既然是XML檔，勢必會有規定的元素(Element)及屬性(Attribute):
元素:
<transition>*
必須是根元素，包含一個或兩個<item>
屬性:
xmlns:android(String)*
必為"http://schemas.android.com/apk/res/android"
<item>
圖像，必為子元素，和圖層清單一樣接受<bitmap>
屬性：
android:drawable(Drawable Resource)*
圖像
android:id(Resource ID)
此圖像的唯一資源ID
android:top(int)
頂部偏移量(以像素為單位)
android:right(int)
右偏移量(以像素為單位)
android:bottom(int)
底部偏移量(以像素為單位)
android:left(int)
左偏移量(以像素為單位)
範例(來自Android官方文件):
| <transition xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/on" /> <item android:drawable="@drawable/off" /> </transition> |
八、插入圖(Inset Drawable)：
可以以一定距離插入一個圖像，放在res/drawble/底下的xml檔案
既然是XML檔，勢必會有規定的元素(Element)及屬性(Attribute):
元素:
<inset>
定義圖像，必須是根元素。
屬性：
xmlns:android(String)*
必須為 "http://schemas.android.com/apk/res/android"
android:drawable(Drawable Resource)*
引用要插入的圖像
android:insetTop(Dimension or Dimension Resource)
頂部距離
android:insetRight(Dimension or Dimension Resource)
右邊距離
android:insetBottom(Dimension or Dimension Resource)
底部距離
android:insetLeft(Dimension or Dimension Resource)
左邊距離
範例(來自Android官方文件):
| <inset xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/background" android:insetTop="10dp" android:insetLeft="10dp" /> |
九、裁切圖(Clip Drawable)：
指的是一張圖要裁切成多少分來顯示，放在res/drawble/底下的xml檔案
既然是XML檔，勢必會有規定的元素(Element)及屬性(Attribute):
元素:
<clip>
定義圖像，必須是根元素。
屬性:
xmlns:android(String)*
定義XML名稱空間，該名稱空間必須為 "http://schemas.android.com/apk/res/android"
android:drawable(Drawable Resource)*
對要裁剪的可繪製資源的引用
android:clipOrientation(String)
裁切的方向
| 值 | 描述 |
| horizontal | 水平 |
| vertical | 垂直 |
android:gravity(String)
指定裁剪的位置，以" | "分隔
| 值 | 描述 |
| top | 將對象放在其容器的頂部，不更改其大小 |
| bottom | 將對象放在其容器的底部，不更改其大小 |
| left(默認) | 將對象放在其容器的左邊緣，不更改其大小 |
| right | 將對象放在其容器的右邊緣，不更改其大小 |
| center_vertical | 將對象放置在其容器的垂直中心，不更改其大小 |
| fill_vertical | 如果需要，增加垂直大小，使其完全填滿容器 |
| center_horizontal | 將對象放置在其容器的水平中心，不更改其大小 |
| fill_horizontal | 如果需要，增加水平大小，使其完全填滿容器 |
| center | 將對象放置在容器的中心，不更改其大小 |
| fill | 如果需要，請增加水平和垂直大小，使其完全填滿容器 |
| clip_vertical | (備註1 |
| clip_horizontal | (備註1 |
範例(來自Android官方文件):
| <clip xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/android" android:clipOrientation="horizontal" android:gravity="left" /> |
十、縮放圖(Scale Drawable)：
顧名思義就是把原本的圖做縮放，放在res/drawble/底下的xml檔案
既然是XML檔，勢必會有規定的元素(Element)及屬性(Attribute):
元素:
<scale>
定義可繪製的比例。這必須是根元素
屬性:
xmlns:android(String)*
必須為"http://schemas.android.com/apk/res/android"
android:drawable(Drawable Resource)*
引用可繪製資源
android:scaleGravity(String)
指定縮放後的重力位置，以" | "分隔
| 值 | 描述 |
| top | 將對象放在其容器的頂部，不更改其大小 |
| bottom | 將對象放在其容器的底部，不更改其大小 |
| left(默認) | 將對象放在其容器的左邊緣，不更改其大小 |
| right | 將對象放在其容器的右邊緣，不更改其大小 |
| center_vertical | 將對象放置在其容器的垂直中心，不更改其大小 |
| fill_vertical | 如果需要，增加垂直大小，使其完全填滿容器 |
| center_horizontal | 將對象放置在其容器的水平中心，不更改其大小 |
| fill_horizontal | 如果需要，增加水平大小，使其完全填滿容器 |
| center | 將對象放置在容器的中心，不更改其大小 |
| fill | 如果需要，請增加水平和垂直大小，使其完全填滿容器 |
| clip_vertical | (備註1 |
| clip_horizontal | (備註1 |
android:scaleHeight(%)
根據原圖的大小做高度縮放
格式:XX％
例如:100％,12.5％
android:scaleWidth(%)
根據原圖的大小做寬度縮放
格式:XX％
例如:100％,12.5％
範例(來自Android官方文件):
| <scale xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/logo" android:scaleGravity="center_vertical|center_horizontal" android:scaleHeight="80%" android:scaleWidth="80%" /> |
十一、形狀圖(Shape Drawable)：
用xml定義的一般形狀，放在res/drawble/底下的xml檔案
既然是XML檔，勢必會有規定的元素(Element)及屬性(Attribute):
元素:
<shape>
形狀圖像，這必須是根元素
屬性:
xmlns:android(String)*
必須為"http://schemas.android.com/apk/res/android"。
android:shape(String)
定義形狀的類型，可以是:
| 值 | 描述 |
| rectangle(默認) | 矩形 |
| oval | 橢圓 |
| line | 線(必須要有<stroke>來定義線寬) |
| ring | 環形 |
如果android:shape="ring":
android:innerRadius(Dimension or Dimension Resource)
環內部的半徑，以尺寸表示
android:innerRadiusRatio(float)
環內部的半徑，以比例表示，此值會被android:innerRadius覆蓋，預設為9
例如:android:innerRadiusRatio="5"，內半徑等於環的寬度除以5
android:thickness(Dimension or Dimension Resource)
環的厚度，以尺寸表示
android:thicknessRatio(float)
環的厚度，以比例表示，此值會被android:innerRadius覆蓋，預設為3
例如:android:thicknessRatio="2"，則厚度等於環的寬度除以2
android:useLevel(boolean)
如果將圖用在LevelListDrawable則為"true"，通常為"false"，否則形狀可能不會出現。
<corners>
為形狀創建圓角，僅在形狀為矩形時適用。
屬性:
android:radius(Dimension or Dimension Resource)
角的半徑，以尺寸表示。以下屬性覆蓋針對該角的設定
android:topLeftRadius(Dimension or Dimension Resource)
左上角的半徑，以尺寸表示
android:topRightRadius(Dimension or Dimension Resource)
右上角的半徑，以尺寸表示
android:bottomLeftRadius(Dimension or Dimension Resource)
左下角的半徑，以尺寸表示
android:bottomRightRadius(Dimension or Dimension Resource)
右下角的半徑，以尺寸表示
注意:必須為每個角(或其初始值)提供大於1的半徑，否則將不對任何角進行處理，允許先設置為1後再針對各角設置小於1的值，甚至為0
<gradient>
指定形狀的漸變顏色
屬性:
android:angle(int)
漸變角度，以度為單位。從左到右為0，從下到上為90，必須是45的倍數，默認為0。
android:centerX(float)
漸變中心的相對X位置(0~1.0)
android:centerY(float)
漸變中心的相對Y位置(0~1.0)
android:centerColor(Color or Color Resource)
介於開始和結束之間的顏色
android:endColor(Color or Color Resource)
結束顏色
android:gradientRadius(float)
漸變的半徑。僅在android:type="radial"時應用
android:startColor(Color or Color Resource)
起始顏色
android:type(String)
要應用的漸變圖案的類型，可以是:
| 值 | 描述 |
| linear(默認) | 線性 |
| radial | 放射狀 |
| sweep | 掃描 |
android:useLevel(boolean)
如果將圖用在LevelListDrawable則為"true"
<padding>
填充View元素的位置
屬性:
android:left(Dimension or Dimension Resource)
左填充
android:top(Dimension or Dimension Resource)
頂部填充
android:right(Dimension or Dimension Resource)
右填充
android:bottom(Dimension or Dimension Resource)
底部填充
<size>
形狀的大小。
屬性:
android:height(Dimension or Dimension Resource)
高度
android:width(Dimension or Dimension Resource)
寬度
注意:預設會將圖像按此處定義的尺寸比例縮放到View的大小
<solid>
純色填充形狀。
屬性:
android:color(Color or Color Resource)
要填充的顏色
<stroke>
描邊線。
屬性:
android:width(Dimension or Dimension Resource)
線的粗細
android:color(Color or Color Resource)
線條的顏色
android:dashGap(Dimension or Dimension Resource)
虛線之間的距離，只有在android:dashWidth存在時應用
android:dashWidth(Dimension or Dimension Resource)
每條虛線的大小，只有在android:dashGap存在時應用
十二、備註：
備註1:我看不懂，期待有人翻譯ww ↓
clip_vertical : Additional option that can be set to have the top and/or bottom edges of the child clipped to its container's bounds. The clip is based on the vertical gravity: a top gravity clips the bottom edge, a bottom gravity clips the top edge, and neither clips both edges.
clip_horizontal : Additional option that can be set to have the left and/or right edges of the child clipped to its container's bounds. The clip is based on the horizontal gravity: a left gravity clips the right edge, a right gravity clips the left edge, and neither clips both edges.
備註2:我不太了解實際用途，希望有人能幫我理解或等我實際測試結果，官方文件
達人
