Android Drawable(可绘制对象资源)

       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
    <!-- 字符串。定义 XML 命名空间 -->
    xmlns:android="http://schemas.android.com/apk/res/android"
    <!-- 可绘制对象资源(位图文件) -->
    android:src="@[package:]drawable/drawable_resource"
    <!-- 启用或停用抗锯齿 -->
    android:antialias=["true" | "false"]
    <!-- 当位图的像素配置与屏幕不同时(例如:ARGB 8888 位图和 RGB 565 屏幕),启用或停用位图抖动 -->
    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"]
    <!-- 启用或停用 mipmap 提示 -->
    android:mipMap=["true" | "false"]
    <!-- 定义平铺模式。当平铺模式启用时,位图会重复。重力在平铺模式启用时将被忽略 -->
    <!-- disabled:不平铺位图。默认值 -->
    <!-- clamp:当着色器绘制范围超出其原边界时复制边缘颜色 -->
    <!-- repeat:水平和垂直重复着色器的图像 -->
    <!-- mirror:水平和垂直重复着色器的图像,交替镜像图像以使相邻图像始终相接 -->
    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
    <!-- 字符串。定义 XML 命名空间 -->
    xmlns:android="http://schemas.android.com/apk/res/android"
    <!-- 可绘制对象资源(.9.png 文件) -->
    android:src="@[package:]drawable/drawable_resource"
    <!-- 当位图的像素配置与屏幕不同时(例如:ARGB 8888 位图和 RGB 565 屏幕),启用或停用位图抖动 -->
    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"?>
<!-- 图层列表资源文件的根元素,包含一个或多个 <item> 元素 -->
<layer-list
    <!-- XML命名空间,必须 "http://schemas.android.com/apk/res/android" -->
    xmlns:android="http://schemas.android.com/apk/res/android" >
    <!-- 定义每一层的item -->
    <item
        <!-- 可绘制对象资源 -->
        android:drawable="@[package:]drawable/drawable_resource"
        <!-- 资源ID。此可绘制对象的唯一资源ID -->
        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"
    <!-- 如果可绘制对象报告的内部大小在状态变更时保持不变,则值为true。如果更加变化则为false -->
    android:constantSize=["true" | "false"]
    <!-- 将在位图的像素配置与屏幕不同时(例如:ARGB 8888 位图和 RGB 565 屏幕)启用位图的抖动 -->
    android:dither=["true" | "false"]
    <!-- 如果可绘制对象的内边距应根据选择的当前状态而变化,则值为“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"
        <!-- 该item level允许的最大值 -->
        android:maxLevel="integer"
        <!-- 该item level允许的最小值 -->
        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" >

    <!-- 定义要用作可绘制对象转换一部分的可绘制对象。必须是<transition>元素的子项。接受子<bitmap>元素 -->
    <item
        <!-- 可绘制对象资源 -->
        android:drawable="@[package:]drawable/drawable_resource"
        <!-- 此可绘制对象的唯一资源ID -->
        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"
    <!-- Drawable距离View顶部边缘的距离 -->
    android:insetTop="dimension"
    <!-- Drawable距离View右边边缘的距离 -->
    android:insetRight="dimension"
    <!-- Drawable距离View底部边缘的距离 -->
    android:insetBottom="dimension"
    <!-- Drawable距离View左边边缘的距离 -->
    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标签解释:

<?xml version="1.0" encoding="utf-8"?>
<clip
    xmlns:android="http://schemas.android.com/apk/res/android"
    <!-- 引用要裁剪的可绘制对象资源 -->
    android:drawable="@drawable/drawable_resource"
    <!-- 裁剪方向 同时设置多个 用|隔开 -->
    android:clipOrientation=["horizontal" | "vertical"]
    <!-- 配合clipOrientation使用,指定可绘制对象中要裁剪的位置 -->
    android:gravity=["top" | "bottom" | "left" | "right" | "center_vertical" |
    "fill_vertical" | "center_horizontal" | "fill_horizontal" |
    "center" | "fill" | "clip_vertical" | "clip_horizontal"] />

android:gravity 参数值解释

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

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"]
    <!-- 百分比。缩放高度,它是控件能够缩小的最小高度尺寸。比如:10%, 表示Drawable高度最小能缩小到控件的10%(还有90%展示出来) -->
    android:scaleHeight="percentage"
    <!-- 缩放宽度,它是控件能够缩小的最小宽度尺寸。比如:10%, 表示Drawable宽度最小能缩小到控件的10%(还有90%展示出来) -->
    android:scaleWidth="percentage" />

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

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

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"
    <!-- 定义形状的类型 rectangle:默认形状矩形 oval:椭圆形状 line:水平线,需要<stroke>元素定义线宽 ring:环形 -->
    android:shape=["rectangle" | "oval" | "line" | "ring"]
    <!-- android:shape="ring"属性有效。环内部(中间的孔)的半径 -->
    android:innerRadius = "integer"
    <!-- android:shape="ring"属性有效 浮点型。环内部的半径,以环宽度的比率表示。如果android:innerRadiusRatio="5",则内半径等于环宽度除以5。默认值为9 -->
    android:innerRadiusRatio = "float"
    <!-- android:shape="ring"属性有效 环的厚度-->
    android:thickness = "integer"
    <!-- android:shape="ring"属性有效 浮点型。环的厚度,表示为环宽度的比率。如果android:thicknessRatio="2",则厚度等于环宽度除以2 默认9-->
    android:thicknessRatio = "integer"
    <!-- 只有当我们的shape使用在LevelListDrawable中的时候,这个值为true,否则为false -->
    android:useLevel = "boolean"
    <!-- 图像的抖动处理 -->
    android:dither = "boolean"
    <!-- 着色效果,有些纯色图片,如果需要显示别的颜色效果,直接加上就行,特别方便 -->
    android:tint = "integer"
    <!-- 用来设置shape的显示和隐藏 -->
    android:visible = "integer">

    <!-- 为形状产生圆角。仅当形状为矩形(android:shape="rectangle")时适用 -->
    <corners
        <!-- 所有角的半径 -->
        android:radius="integer"
        <!-- 左上角的半径 -->
        android:topLeftRadius="integer"
        <!-- 右上角的半径 -->
        android:topRightRadius="integer"
        <!-- 左下角的半径 -->
        android:bottomLeftRadius="integer"
        <!-- 右下角的半径 -->
        android:bottomRightRadius="integer" />

    <!-- 指定形状的渐变颜色 -->
    <gradient
        <!-- 渐变的角度(度)。0 为从左到右,90 为从上到上。必须是 45 的倍数。默认值为 0 -->
        android:angle="integer"
        <!-- 浮点型。渐变中心的相对 X 轴位置 (0 - 1.0) -->
        android:centerX="float"
        <!-- 浮点型。渐变中心的相对 Y 轴位置 (0 - 1.0) -->
        android:centerY="float"
        <!-- 颜色。起始颜色与结束颜色之间的可选颜色,以十六进制值或颜色资源表示 -->
        android:centerColor="integer"
        <!-- 颜色。结束颜色,表示为十六进制值或颜色资源 -->
        android:endColor="color"
        <!-- 浮点型。渐变的半径。仅在 android:type="radial" 时适用 -->
        android:gradientRadius="integer"
        <!-- 颜色。起始颜色,表示为十六进制值或颜色资源 -->
        android:startColor="color"
        <!-- 要应用的渐变图案的类型:linear:默认值线性渐变, radial:径向渐变。起始颜色为中心颜色, sweep:流线型渐变 -->
        android:type=["linear" | "radial" | "sweep"]
        <!-- 只有当我们的shape使用在LevelListDrawable中的时候,这个值为true,否则为false -->
        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

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

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

展开阅读全文

没有更多推荐了,返回首页