Android可绘制资源概览(背景、图形等)

关于作者:CSDN内容合伙人、技术专家, 从零开始做日活千万级APP。

专注于分享各领域原创系列文章 ,擅长java后端、移动开发、商业变现、人工智能等,希望大家多多支持。

目录

  • 一、导读
  • 二、概览
  • [三、drawable 分类](#三、drawable 分类)
    • [3.1 Bitmap file](#3.1 Bitmap file)
      • [XML 位图](#XML 位图)
    • [3.2 Nine-patch file](#3.2 Nine-patch file)
    • [3.3 Layer list](#3.3 Layer list)
    • [3.4 State list](#3.4 State list)
    • [3.5 Level list](#3.5 Level list)
    • [3.6 Transition drawable](#3.6 Transition drawable)
    • [3.7 Inset drawable](#3.7 Inset drawable)
    • [3.8 Clip drawable](#3.8 Clip drawable)
    • [3.9 Scale drawable](#3.9 Scale drawable)
    • [3.10 Shape drawable.](#3.10 Shape drawable.)
  • [四、 推荐阅读](#四、 推荐阅读)

一、导读

我们继续总结学习Android 基础知识,温故知新。

二、概览

可绘制资源是图形的一般概念,是指可在屏幕上绘制的图形,以及可使用 getDrawable(int) 等 API 检索,或应用到具有 android:drawable 和 android:icon 等属性的其他 XML 资源的图形。

三、drawable 分类

3.1 Bitmap file

位图图形文件(PNG、WEBP、JPG 或 GIF)。 可创建 BitmapDrawable。

直接代码引用:

kotlin 复制代码
val drawable: Drawable? = ResourcesCompat.getDrawable(resources, R.drawable.myimage, null)
java 复制代码
Resources res = getResources();
Drawable drawable = ResourcesCompat.getDrawable(res, R.drawable.myimage, null);

我们也可以为这些文件创建一个别名,即XML 位图。

XML 位图

XML 位图是在 XML 文件中定义的资源,指向位图文件,同时可以设置位图的其他属性,例如抖动和平铺

文件位置:
    res/drawable/filename.xml
    文件名即为资源 ID
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"]                                          启用或停用 mipmap 提示
    android:tileMode=["disabled" | "clamp" | "repeat" | "mirror"] />           定义平铺模式
xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@drawable/icon"
    android:gravity="bottom"
    android:tileMode="repeat" />

-- 元素用可以作 元素的子项--

xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <bitmap
            android:gravity="bottom"
            android:src="@drawable/xyz" />
    </item>
</layer-list>

3.2 Nine-patch file

具有可伸缩区域的 PNG 文件,支持根据内容调整图像大小 (.9.png)。可创建 NinePatchDrawable。

同上

3.3 Layer list

管理其他可绘制对象数组的可绘制对象。这些可绘制对象按数组顺序绘制,因此索引最大的元素绘制于顶部。可创建 LayerDrawable。

通用说法,layer-list将多个图片或效果按照顺序层叠起来,通常和selector、shape配合使用.

语法

xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<layer-list                                                           包含一个或多个 <item> 元素
    xmlns:android="http://schemas.android.com/apk/res/android" >
    <item                   定义放于图层可绘制对象中的可绘制对象,位置由其属性定义。必须为 <layer-list> 元素的子项。接受子级 <bitmap> 元素。
        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>
xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <bitmap
            android:gravity="bottom"
            android:src="@drawable/xyz" />
    </item>
</layer-list>

3.4 State list

此 XML 文件用于为不同状态引用不同位图图形,例如,点按按钮时使用不同图像。可创建 StateListDrawable。

它会根据对象状态,使用多个图像来表示同一个图形。例如,Button widget 的状态可以是按下、聚焦或既不按下也不聚焦;而使用状态列表可绘制对象,您可以为每种状态提供不同的背景图像。

xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"  包含一个或多个 <item> 元素。
    android:constantSize=["true" | "false"] 如果可绘制对象报告的内部大小在状态变更时保持不变,则值为 true(大小是所有状态的最大值);如果大小根据当前状态而变化,则值为 false。默认值为 false
    android:dither=["true" | "false"] 将在位图的像素配置与屏幕不同时(例如:ARGB 8888 位图和 RGB 565 屏幕)启用位图的抖动;值为 false 时则停用抖动。默认值为 true
    android:variablePadding=["true" | "false"] > 如果可绘制对象的内边距根据当前所选状态而变化,则为 true;如果该内边距必须保持不变(基于所有状态的最大内边距),则为 false
    <item
        android:drawable="@[package:]drawable/drawable_resource"
        android:state_pressed=["true" | "false"]  如果是在点按对象时(例如轻触按钮时)使用此项,则为 true;如果是在默认的非点按状态下使用此项,则为 false。
        android:state_focused=["true" | "false"]  如果是在对象具有输入焦点时(例如当用户选择文本输入时)使用此项,则为 true;如果是在默认的非聚焦状态下使用此项,则为 false
        android:state_hovered=["true" | "false"]  如果是在光标悬停在对象上时使用此项,则为 true;如果是在默认的非悬停状态下使用此项,则为 false。通常情况下,这个可绘制对象可以是用于"聚焦"状态的同一可绘制对象
        android:state_selected=["true" | "false"] 如果是在使用定向控件进行导航(例如使用方向键浏览列表)时对象为用户当前选择时使用此项,则为 true;如果是在未选择对象时使用此项,则为 false
        android:state_checkable=["true" | "false"] 如果是在对象可供选择时使用此项,则为 true;如果是在对象不可选择时使用此项,则为 false。仅适用于对象可在可选择和不可选择的 widget 之间转换的情况
        android:state_checked=["true" | "false"] 如果是在对象被选择时使用此项,则为 true;如果是在对象未被选择时使用此项,则为 false
        android:state_enabled=["true" | "false"] 如果是在启用对象(即能够接收轻触或点击事件)时使用此项,则为 true;如果是在停用对象时使用此项,则为 false
        android:state_activated=["true" | "false"] 如果是在对象处于永久选择启用状态(例如,在常驻导航视图中"突出显示"之前选择的列表项)时使用此项,则为 true;如果是在对象处于未启用状态时使用此项,则为 false
        android:state_window_focused=["true" | "false"] /> 如果是在应用窗口具有焦点(即应用位于前台)时使用此项,则为 true;如果是在应用窗口没有焦点(例如通知栏下拉或出现一个对话框)时使用此项,则为 false。
</selector>
xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<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:drawable="@drawable/button_normal" /> <!-- default -->
</selector>

这个地方,我们也可以将图片(android:drawable)换成颜色(android:color)

ColorStateList 是一个可以在 XML 中定义并应用为颜色的对象,它实际上是根据所应用到的 View 对象的状态来改变颜色。

例如,Button widget 可以处于几种状态(即按下、聚焦或既不按下也不聚焦)中的一种。您可以使用颜色状态列表,为每种状态提供不同的颜色。

xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:color="hex_color"                          十六进制颜色
        android:lStar="floating_point_value"               修改基本颜色的感知亮度
        android:state_pressed=["true" | "false"]
        android:state_focused=["true" | "false"]
        android:state_selected=["true" | "false"]
        android:state_checkable=["true" | "false"]
        android:state_checked=["true" | "false"]
        android:state_enabled=["true" | "false"]
        android:state_window_focused=["true" | "false"] />
</selector>

eg:

xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true"
          android:color="#ffff0000"/> <!-- pressed -->
    <item android:state_focused="true"
          android:color="#ff0000ff"/> <!-- focused -->
    <item android:color="#ff000000"/> <!-- default -->
</selector>

3.5 Level list

此 XML 文件用于定义管理大量备选可绘制对象的可绘制对象,每个可绘制对象都配有最大备选数量。可创建 LevelListDrawable。

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>

将此项应用到 View 后,您便可通过 setLevel() 或 setImageLevel() 更改级别

xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<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>

有时候需要对一个ImageView设置很多不同图片以表示某种应用状态,比如,典型的是手机的信号强度从强到弱有多种状态图;wifi有解锁和未解锁状态,解锁和未解锁状态的图标也是很多种。

如果每次都一一的通过ImageView设置图片的src来达到这一目的,实在是太过于繁琐,且维护和管理起来不便

3.6 Transition drawable

此 XML 文件用于定义可在两种可绘制资源之间交错淡出的可绘制对象。可创建 TransitionDrawable。

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>

3.7 Inset drawable

此 XML 文件用于定义以指定距离插入其他可绘制对象的可绘制对象。当视图需要小于视图实际边界的背景可绘制对象时,此类可绘制对象非常有用。

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" />

3.8 Clip drawable

此 XML 文件用于定义对其他可绘制对象进行裁剪(根据其当前级别值)的可绘制对象。可创建 ClipDrawable。

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"]
    android:gravity=["top" | "bottom" | "left" | "right" | "center_vertical" |
                     "fill_vertical" | "center_horizontal" | "fill_horizontal" |
                     "center" | "fill" | "clip_vertical" | "clip_horizontal"] />

3.9 Scale drawable

此 XML 文件用于定义更改其他可绘制对象大小(根据其当前级别值)的可绘制对象。可创建 ScaleDrawable。

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" />

3.10 Shape drawable.

此 XML 文件用于定义几何图形形状(包括颜色和渐变)。可创建 GradientDrawable。

xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape=["rectangle" | "oval" | "line" | "ring"] >
    <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:dashWidth="integer"
        android:dashGap="integer" />
</shape>

以上的一些元素,我们都是可以组合使用的

xml 复制代码
一个红色的层加一个白色的层叠在一起显示的结果
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
   
<!--选中时的效果--!>
    <item android:state_checked="true">
        <layer-list>
            <!-- 红色背景 -->
            <item>
                <color android:color="#E4007F" />
            </item>
            <!-- 白色背景 -->
            <item android:bottom="4dp" android:drawable="@android:color/white" />
        </layer-list>
    </item>
 
<!--默认时的效果--!>
    <item>
        <layer-list>
            <!-- 红色背景 -->
            <item>
                <color android:color="#E4007F" />
            </item>
            <!-- 白色背景 -->
            <item android:bottom="1dp" android:drawable="@android:color/white" />
        </layer-list>
    </item>
</selector>

再比如,带阴影的圆形矩阵是由一个灰色的层加上白色的层组成

xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 灰色阴影 -->
    <item
        android:left="2dp"
        android:top="4dp">
        <shape>
            <solid android:color="@android:color/darker_gray" />
            <corners android:radius="10dp" />
        </shape>
    </item>
    <!-- 白色前景 -->
    <item
        android:bottom="4dp"
        android:right="2dp">
        <shape>
            <solid android:color="#FFFFFF" />
            <corners android:radius="10dp" />
        </shape>
    </item>
</layer-list>

google

四、 推荐阅读

Java 专栏

SQL 专栏

数据结构与算法

Android学习专栏

相关推荐
Eastsea.Chen1 小时前
MTK Android12 user版本MtkLogger
android·framework
长亭外的少年9 小时前
Kotlin 编译失败问题及解决方案:从守护进程到 Gradle 配置
android·开发语言·kotlin
周三有雨10 小时前
【面试题系列Vue07】Vuex是什么?使用Vuex的好处有哪些?
前端·vue.js·面试·typescript
爱米的前端小笔记11 小时前
前端八股自学笔记分享—页面布局(二)
前端·笔记·学习·面试·求职招聘
好学近乎知o11 小时前
解决sql字符串
面试
建群新人小猿11 小时前
会员等级经验问题
android·开发语言·前端·javascript·php
1024小神12 小时前
tauri2.0版本开发苹果ios和安卓android应用,环境搭建和最后编译为apk
android·ios·tauri
兰琛12 小时前
20241121 android中树结构列表(使用recyclerView实现)
android·gitee
Y多了个想法13 小时前
RK3568 android11 适配敦泰触摸屏 FocalTech-ft5526
android·rk3568·触摸屏·tp·敦泰·focaltech·ft5526
NotesChapter14 小时前
Android吸顶效果,并有着ViewPager左右切换
android