Android Drawable（可绘制对象资源）

太过爱你忘了你带给我的痛 2022-05-27 14:15 170阅读 0赞

Drawable：Android中是指可在屏幕上绘制的图形。Android里面有以下几种常见的Drawable（他们都继承自Drawable）：位图文件（BitmapDrawable）、9.png文件（NinePatchDrawable）、图层列表（LayerDrawable）、状态列表（StateListDrawable）、级别列表（LevelListDrawable）、转换可绘制对象（TransitionDrawable）、插入可绘制对象（InsetDrawable）、裁剪可绘制对象（ClipDrawable）、缩放可绘制对象（ScaleDrawable）、形状可绘制对象（ShapeDrawable）。

### 一、位图（BitmapDrawable） ###

位图应该是开发过程中使用最多的Drawable资源了。位图分两种：位图文件、XML位图。

#### 1.1、位图文件 ####

一般美工直接给到我们的就是位图文件了。Android 支持三种格式的位图文件：.png（首选）、.jpg（可接受）、.gif（不建议）。

1.  位图文件位置：res/drawable/filename.png（.png、.jpg 或 .gif），当然了至于是drawable-xhdpi、drawable-xxhdpi、还是drawable-xxxhdpi等文件夹就需要根据美工的出图标准来了。
2.  资源类型对象：BitmapDrawable。

#### 1.2、XML位图 ####

XML位图对应标签，是在XML中定义的资源，指向位图文件。同时可以对位图文件添加一些额外的属性，例如抖动和层叠等等。

1.  XML文件位置：res/drawable/filename.xml。
2.  资源类型对象：BitmapDrawable。
3.  XML位图标签解释：

<?xml version="1.0" encoding="utf-8"?>  <bitmap  xmlns:android="http://schemas.android.com/apk/res/android"  android:src="@[package:]drawable/drawable_resource"  android:antialias=["true" | "false"]  android:dither=["true" | "false"]  android:filter=["true" | "false"]  android:gravity=["top" | "bottom" | "left" | "right" | "center_vertical" | "fill_vertical" | "center_horizontal" | "fill_horizontal" | "center" | "fill" | "clip_vertical" | "clip_horizontal"]  android:mipMap=["true" | "false"]      android:tileMode=["disabled" | "clamp" | "repeat" | "mirror"] />

### 二、9.png（NinePatchDrawable） ###

在Android开发过程中很多控件需要适配不同的手机分辨率进行拉伸或者压缩，这个时候就产生了NinePatchDrawable，它可以指定特定的区域进行拉伸而不失真，同时可以指定前景内容(内容区域)的显示区域。

和位图一样9.png也分为两种：9.png文件、XML 9.png。

#### 2.1、9.png文件 ####

.9.png图片格式，保证图片被拉伸的时候不失真，是一种特殊的图片格式。

1.  9.png文件位置：res/drawable/filename.9.png．
2.  资源类型对象：NinePatchDrawable。

#### 2.2、XML 9.png ####

XML　9.png对应标签，是在XML中定义的资源，指向9.png文件。可以对.9.png文件添加一些额外的属性，例如抖动

1.  文件位置：res/drawable/filename.xml。
2.  资源类型对象：NinePatchDrawable。
3.  XML位图标签解释：

<?xml version="1.0" encoding="utf-8"?>  <nine-patch  xmlns:android="http://schemas.android.com/apk/res/android"  android:src="@[package:]drawable/drawable_resource"  android:dither=["true" | "false"] />

### 三、图层列表（LayerDrawable） ###

LayerDrawable：对应标签， 将多个drawable按照顺序层叠在一起显示。里面的每一个item都相当于一个Drawable。每个item按照列表的顺序绘制，最后一个item绘于顶部。

1.  文件位置：res/drawable/filename.xml。
2.  资源类型对象：LayerDrawable。
3.  XML标签解释：

<?xml version="1.0" encoding="utf-8"?>  <layer-list  xmlns:android="http://schemas.android.com/apk/res/android" >  <item  android:drawable="@[package:]drawable/drawable_resource"  android:id="@[+][package:]id/resource_name"  android:top="dimension"  android:right="dimension"  android:bottom="dimension"  android:left="dimension" /> </layer-list>

1.  应用场景：实现阴影效果、单边显示（下划线）、加号等等。  
      
    ![LayerDrawable][]

### 四、状态列表（StateListDrawable） ###

StateListDrawable：对应标签，这个也是我们开发过程中经常要用到的Drawable。背景选择器让控件可以根据不同状态显示不同的背景(每一种状态对应一个标签)。例如，Button有多种不同状态（按下、松开或这两种状态都不是），这样可以在Button按下的时候显示一种背景，松开的时候又显示另一种背景。

> 从上到下遍历状态列表，并使用第一个与当前状态匹配的项目 —此选择并非基于“最佳匹配”。这也是默认值为啥要放在最后面的原因。

1.  XML文件位置：res/drawable/filename.xml。
2.  资源类型对象：StateListDrawable。
3.  XML标签解释：

<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"  android:constantSize=["true" | "false"]  android:dither=["true" | "false"]  android:variablePadding=["true" | "false"] >  <item  android:drawable="@[package:]drawable/drawable_resource"  android:state_pressed=["true" | "false"]  android:state_focused=["true" | "false"]  android:state_hovered=["true" | "false"]  android:state_selected=["true" | "false"]  android:state_checkable=["true" | "false"]  android:state_checked=["true" | "false"]  android:state_enabled=["true" | "false"]  android:state_activated=["true" | "false"]  android:state_window_focused=["true" | "false"] /> </selector>

> 注：如果要多个状态同时满足，可以在同一个item里面指定多个状态，例如：

### 五、级别列表（LevelListDrawable） ###

LevelListDrawable：对应标签，根据Drawable的setLevel()函数设置的level。显示不同的背景。有时候需要我们确实需要对一个View设置很多不同图片以表示某种应用状态，比如，手机的信号强度从强到弱有多种状态图；wifi有解锁和未解锁状态。使用的时候需要配合Drawable的setLevel()函数设置级别(level范围:0~10000)。 根据设置的级别来找标签里面对应的

1.  XML文件位置：res/drawable/filename.xml。
2.  资源类型对象：LevelListDrawable。
3.  XML标签解释：

<?xml version="1.0" encoding="utf-8"?> <level-list xmlns:android="http://schemas.android.com/apk/res/android" >  <item  android:drawable="@drawable/drawable_resource"  android:maxLevel="integer"  android:minLevel="integer" /> </level-list>

> android:maxLevel和android:minLevel：当Drawable调用setLevel()函数设置的级别处于两者之间则显示该对应的资源。

1.  实例：  
      
    ![LevelListDrawable][]

### 六、转换可绘制对象（TransitionDrawable） ###

TransitionDrawable：对应标签 ，在两个drawable资源之间淡入淡出切换的drawable对象。每个drawable对应一个 元素。只支持两个item。要向前转换，调用 startTransition()。要向后转换，则调用 reverseTransition()。

1.  XML文件位置：res/drawable/filename.xml。
2.  资源类型对象：TransitionDrawable。
3.  XML标签解释：

<?xml version="1.0" encoding="utf-8"?> <transition xmlns:android="http://schemas.android.com/apk/res/android" >  <item  android:drawable="@[package:]drawable/drawable_resource"  android:id="@[+][package:]id/resource_name"  android:top="dimension"  android:right="dimension"  android:bottom="dimension"  android:left="dimension" /> </transition>

> 只是支持两个item。其实切换的过程也只是把哪个item显示在上面，另一个则显示在下面。可以简单的认为是上面的item把下面的item盖住了。  
> 4. 实例：  
> 
> 
>   
> ![TransitionDrawable][]

### 七、插入可绘制对象（InsetDrawable） ###

InsetDrawable ：对应标签，让InsetDrawable内嵌到自己View当中，并且可以设置InsetDrawable到View边缘的边距(padding)。InsetDrawable咱们可以简单的认为就是给Drawable增加一个padding的效果。

1.  XML文件位置：res/drawable/filename.xml。
2.  资源类型对象：InsetDrawable。
3.  XML标签解释：

<?xml version="1.0" encoding="utf-8"?> <inset xmlns:android="http://schemas.android.com/apk/res/android"  android:drawable="@drawable/drawable_resource"  android:insetTop="dimension"  android:insetRight="dimension"  android:insetBottom="dimension"  android:insetLeft="dimension" />

> InsetDrawable没什么特别的，只是可以设置距离边缘的距离。  
> 4. 实例：  
> 
> 
>   
> ![InsetDrawable][]

### 八、裁剪可绘制对象（ClipDrawable） ###

ClipDrawable：对应标签，根据Drawable的level等级，将指定的Drawable裁剪到一定的百分比。一定要需要配合Drawable.setLevel（0~10000）函数使用，否则无效。

1.  XML文件位置：res/drawable/filename.xml。
2.  资源类型对象：ClipDrawable。
3.  XML标签解释：

> android:gravity 参数值解释

<table> 
 <thead> 
  <tr> 
   <th>值</th> 
   <th>说明</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>top</td> 
   <td>将对象放在其容器顶部，不改变其大小。当clipOrientation是”vertical” 时，在可绘制对象的底部裁剪。</td> 
  </tr> 
  <tr> 
   <td>bottom</td> 
   <td>将对象放在其容器底部，不改变其大小。当 clipOrientation 是 “vertical” 时，在可绘制对象的顶部裁剪。</td> 
  </tr> 
  <tr> 
   <td>left</td> 
   <td>将对象放在其容器左边缘，不改变其大小。这是默认值。当 clipOrientation 是 “horizontal” 时，在可绘制对象的右边裁剪。这是默认值。</td> 
  </tr> 
  <tr> 
   <td>right</td> 
   <td>将对象放在其容器右边缘，不改变其大小。当 clipOrientation 是 “horizontal” 时，在可绘制对象的左边裁剪。</td> 
  </tr> 
  <tr> 
   <td>center_vertical</td> 
   <td>将对象放在其容器的垂直中心，不改变其大小。裁剪行为与重力为 “center” 时相同。</td> 
  </tr> 
  <tr> 
   <td>fill_vertical</td> 
   <td>按需要扩展对象的垂直大小，使其完全适应其容器。当 clipOrientation 是 “vertical” 时，不会进行裁剪，因为可绘制对象会填充垂直空间（除非可绘制对象级别为 0，此时它不可见）。</td> 
  </tr> 
  <tr> 
   <td>center_horizontal</td> 
   <td>将对象放在其容器的水平中心，不改变其大小。裁剪行为与重力为 “center” 时相同。</td> 
  </tr> 
  <tr> 
   <td>fill_horizontal</td> 
   <td>按需要扩展对象的水平大小，使其完全适应其容器。当 clipOrientation 是 “horizontal” 时，不会进行裁剪，因为可绘制对象会填充水平空间（除非可绘制对象级别为 0，此时它不可见）。</td> 
  </tr> 
  <tr> 
   <td>center</td> 
   <td>将对象放在其容器的水平和垂直轴中心，不改变其大小。当 clipOrientation 是 “horizontal” 时，在左边和右边裁剪。当 clipOrientation 是 “vertical” 时，在顶部和底部裁剪。</td> 
  </tr> 
  <tr> 
   <td>fill</td> 
   <td>按需要扩展对象的垂直大小，使其完全适应其容器。不会进行裁剪，因为可绘制对象会填充水平和垂直空间（除非可绘制对象级别为 0，此时它不可见）。</td> 
  </tr> 
  <tr> 
   <td>clip_vertical</td> 
   <td>可设置为让子元素的上边缘和/或下边缘裁剪至其容器边界的附加选项。裁剪基于垂直重力：顶部重力裁剪上边缘，底部重力裁剪下边缘，任一重力不会同时裁剪两边。</td> 
  </tr> 
  <tr> 
   <td>clip_horizontal</td> 
   <td>可设置为让子元素的左边和/或右边裁剪至其容器边界的附加选项。裁剪基于水平重力：左边重力裁剪右边缘，右边重力裁剪左边缘，任一重力不会同时裁剪两边。</td> 
  </tr> 
 </tbody> 
</table>

> ClipDrawable可以用来实现一些简单的进度条。

1.  实例：可以实现一些简单的进度条之类的  
      
    ![ClipDrawable][]

### 九、缩放可绘制对象（ScaleDrawable） ###

ScaleDrawable：对应标签，根据Drawable的level等级，将指定的Drawable缩放到一定的等级。ScaleDrawable一定要需要配合Drawable.setLevel（0~10000）函数使用，否则无效。

1.  XML文件位置：res/drawable/filename.xml。
2.  资源类型对象：ScaleDrawable。
3.  XML标签解释：

<?xml version="1.0" encoding="utf-8"?> <scale xmlns:android="http://schemas.android.com/apk/res/android"  android:drawable="@drawable/drawable_resource"  android:scaleGravity=["top" | "bottom" | "left" | "right" | "center_vertical" | "fill_vertical" | "center_horizontal" | "fill_horizontal" | "center" | "fill" | "clip_vertical" | "clip_horizontal"]  android:scaleHeight="percentage"  android:scaleWidth="percentage" />

> **注：如果Drawable.setLevel()函数的参数是0，不管android:scaleHeight和android:scaleWidth设置的是多少图片都不会显示。**

<table> 
 <thead> 
  <tr> 
   <th>值</th> 
   <th>说明</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>top</td> 
   <td>将对象放在其容器顶部，不改变其大小。</td> 
  </tr> 
  <tr> 
   <td>bottom</td> 
   <td>将对象放在其容器底部，不改变其大小。</td> 
  </tr> 
  <tr> 
   <td>left</td> 
   <td>将对象放在其容器左边缘，不改变其大小。这是默认值。</td> 
  </tr> 
  <tr> 
   <td>right</td> 
   <td>将对象放在其容器右边缘，不改变其大小。</td> 
  </tr> 
  <tr> 
   <td>center_vertical</td> 
   <td>将对象放在其容器的垂直中心，不改变其大小。</td> 
  </tr> 
  <tr> 
   <td>fill_vertical</td> 
   <td>按需要扩展对象的垂直大小，使其完全适应其容器。</td> 
  </tr> 
  <tr> 
   <td>center_horizontal</td> 
   <td>将对象放在其容器的水平中心，不改变其大小。</td> 
  </tr> 
  <tr> 
   <td>fill_horizontal</td> 
   <td>按需要扩展对象的水平大小，使其完全适应其容器。</td> 
  </tr> 
  <tr> 
   <td>center</td> 
   <td>将对象放在其容器的水平和垂直轴中心，不改变其大小。</td> 
  </tr> 
  <tr> 
   <td>fill</td> 
   <td>按需要扩展对象的垂直大小，使其完全适应其容器。</td> 
  </tr> 
  <tr> 
   <td>clip_vertical</td> 
   <td>可设置为让子元素的上边缘和/或下边缘裁剪至其容器边界的附加选项。裁剪基于垂直重力：顶部重力裁剪上边缘，底部重力裁剪下边缘，任一重力不会同时裁剪两边。</td> 
  </tr> 
  <tr> 
   <td>clip_horizontal</td> 
   <td>可设置为让子元素的左边和/或右边裁剪至其容器边界的附加选项。裁剪基于水平重力：左边重力裁剪右边缘，右边重力裁剪左边缘，任一重力不会同时裁剪两边。</td> 
  </tr> 
 </tbody> 
</table>

4. 实例：

![ScaleDrawable][]

### 十、形状可绘制对象（ShapeDrawable） ###

ShapeDrawable：对应标签，可绘制对象资源．在Android开发过程中Shape可以用来绘制一些简单的形状或者背景．相对与Android里面其他的资源类型(png图片等)来说．Shape大大减少了安装包的大小，而且能够更好的适配不同的手机。

1.  XML文件位置：res/drawable/filename.xml。
2.  资源类型对象：ShapeDrawable。
3.  XML标签解释：

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"  android:shape=["rectangle" | "oval" | "line" | "ring"]  android:innerRadius = "integer"  android:innerRadiusRatio = "float"  android:thickness = "integer"  android:thicknessRatio = "integer"  android:useLevel = "boolean"  android:dither = "boolean"  android:tint = "integer"  android:visible = "integer">  <corners  android:radius="integer"  android:topLeftRadius="integer"  android:topRightRadius="integer"  android:bottomLeftRadius="integer"  android:bottomRightRadius="integer" />  <gradient  android:angle="integer"  android:centerX="float"  android:centerY="float"  android:centerColor="integer"  android:endColor="color"  android:gradientRadius="integer"  android:startColor="color"  android:type=["linear" | "radial" | "sweep"]  android:useLevel=["true" | "false"] />  <padding  android:left="integer"  android:top="integer"  android:right="integer"  android:bottom="integer" />  <size  android:width="integer"  android:height="integer" />  <solid android:color="color" />  <stroke  android:width="integer"  android:color="color"  android:dashGap="integer"  android:dashWidth="integer"/> </shape>

> 当android:shape=”ring”的时候，一定要小心使用android:innerRadiusRatio和android:thicknessRatio两个属性．给的值不恰当的时候可能出来的效果就不是圆环了．innerRadiusRatio:是内部空心区域的半径占控件宽度的几份之一．thicknessRatio：是圆环占控件宽度的几份之一．
> 
> 如果发现shape虚线无效果的时候，可以尝试在View对应的xml里面设置android:layerType=”software”

1.  实例：  
      
    ![ShapeDrawable][]

#### [本文实例下载链接][Link 1] 后续如果看到比较好的效果，我也会慢慢的往实例里面添加的。 ####

> 上面所有的Drawable都会编译解析成对应的资源类型对象BitmapDrawable、LayerDrawable、ShapeDrawable等，那肯定所有XML里面能实现的功能咱们都可以在JAVA代码中通过对应的资源类型对象实现。

[LayerDrawable]: /images/20220527/9237a2ed10ce4f50ac43965ed96bd53a.png
[LevelListDrawable]: /images/20220527/ce0f73bacd244778b51a1ecba6e25a85.png
[TransitionDrawable]: /images/20220527/493645797bad4e0481e02d21b674c750.png
[InsetDrawable]: /images/20220527/02aa05c332864a4d98853909df52888d.png
[ClipDrawable]: /images/20220527/64673f9d732a48ae971d7e50b83d327e.png
[ScaleDrawable]: /images/20220527/227aba1a20a94182bde8e9c0e82764b3.png
[ShapeDrawable]: /images/20220527/aad26e46053549bd9e993403339d0484.png
[Link 1]: https://github.com/tuacy/DrawableResource