Android Drawable Resources: Types and Implementation

Drawable resources represent graphical elements that can be rendered on screen and retrieved via APIs like getDrawable(int). They can be applied to XML attributes such as android:drawable and android:icon. Various drawable types include:

  • Bitmap Files: Image files (.png, .jpg, .gif) that create BitmapDrawable objects
  • Nine-Patch Files: Scalable PNG images (.9.png) that generate NinePatchDrawable instances
  • Layer Lists: Drawables that manage arrays of other drawables, drawn in order with the highest index on top, creating LayerDrawable
  • State Lists: XML files referencing different images for various states (e.g., pressed buttons), producing StateListDrawable
  • Level Lists: XML definitions for drawables managing multiple alternatives with maximum levels, creating LevelListDrawable
  • Transition Drawables: XML resources defining cross-fade animations between two drawables, generating TransitionDrawable
  • Inset Drawables: XML files specifying drawables inset by specific distances from container boundaries
  • Clip Drawables: XML definitions for drawables that clip other drawables based on level values, creating ClipDrawable
  • Scale Drawables: XML resources that resize other drawables according to current level, producing ScaleDrawable
  • Shape Drawables: XML files defining geometric shapes with colors and gradients, creating GradientDrawable

Color resources can also function as drawables in XML. For example, when creating state list drawables, you can reference color resources using android:drawable="@color/green".

Bitmap Resources

Android supports bitmap formats including PNG (preferred), JPG (acceptable), and GIF (discouraged). Bitmap files can be referenecd directly by filename or through XML alias resources.

During build processing, the aapt tool automatically optimizes bitmap files through lossless compression. True-color PNGs with fewer than 256 colors may be converted to 8-bit PNGs using color palettes. To prevent optimization when reading images as bitstreams, place images in the res/raw/ directory instead.

Direct Bitmap Files

File Location: res/drawable/filename.png (.png, .jpg, or .gif)
Compiled Resource: Resource pointer to BitmapDrawable
Resource Reference:

  • Java: R.drawable.filename
  • XML: @[package:]drawable/filename

Example: After saving an image as res/drawable/app_icon.png, this layout XML applies it to a view:

<ImageView
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:src="@drawable/app_icon" />

Application code to retrieve the image as a Drawable:

// Java
Drawable iconDrawable = ResourcesCompat.getDrawable(getResources(), R.drawable.app_icon, null);

// Kotlin
val iconDrawable: Drawable? = ResourcesCompat.getDrawable(resources, R.drawable.app_icon, null)

XML Bitmap Definitions

XML bitmaps are resources defined in XML files that point to bitmap files, functioning as aliases with additional properties like dithering and tiling.

File Location: res/drawable/filename.xml
Compiled Resource: Resource pointer to BitmapDrawable
Resource Reference:

  • Java: R.drawable.filename
  • XML: @[package:]drawable/filename

Syntax:

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

Example:

<?xml version="1.0" encoding="utf-8"?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@drawable/background_pattern"
    android:tileMode="repeat" />

Nine-Patch Resources

Nine-patch images are PNG files with defined scalable regions that allow Android to stretch images when view content exceeds normal boundaries.

Direct Nine-Patch Files

File Location: res/drawable/filename.9.png
Compiled Resource: Resource pointer to NinePatchDrawable
Resource Reference:

  • Java: R.drawable.filename
  • XML: @[package:]drawable/filename

Example: After saving as res/drawable/button_background.9.png:

<Button
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:background="@drawable/button_background" />

XML Nine-Patch Definitions

File Location: res/drawable/filename.xml
Compiled Resource: Resource pointer to NinePatchDrawable
Resource Reference:

  • Java: R.drawable.filename
  • XML: @[package:]drawable/filename

Syntax:

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

Example:

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

Layer List Drawables

LayerDrawable manages arrays of other drawables, drawing them in sequence with the last item appearing on top.

File Locasion: res/drawable/filename.xml
Compiled Resource: Resource pointer to LayerDrawable
Resource Reference:

  • Java: R.drawable.filename
  • XML: @[package:]drawable/filename

Syntax:

<?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>

Example:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <bitmap android:src="@drawable/base_layer"
            android:gravity="center" />
    </item>
    <item android:top="15dp" android:left="15dp">
        <bitmap android:src="@drawable/overlay_layer"
            android:gravity="center" />
    </item>
</layer-list>

State List Drawables

StateListDrawable uses different images for various object states, selected based on the first matching state condition.

File Location: res/drawable/filename.xml
Compiled Resource: Resource pointer to StateListDrawable
Resource Reference:

  • Java: R.drawable.filename
  • XML: @[package:]drawable/filename

Syntax:

<?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_selected=["true" | "false"]
        android:state_enabled=["true" | "false"] />
</selector>

Example:

<?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" />
    <item android:state_focused="true"
          android:drawable="@drawable/button_focused" />
    <item android:drawable="@drawable/button_normal" />
</selector>

Level List Drawables

LevelListDrawable manages multiple alternative drawables, each with maximum level values. When setting a level via setLevel(), the drawable with android:maxLevel greater than or equal to the passed value loads.

File Location: res/drawable/filename.xml
Compiled Resource: Resource pointer to LevelListDrawable
Resource Reference:

  • Java: R.drawable.filename
  • XML: @[package:]drawable/filename

Syntax:

<?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>

Example:

<?xml version="1.0" encoding="utf-8"?>
<level-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/battery_low" android:maxLevel="20" />
    <item android:drawable="@drawable/battery_medium" android:maxLevel="60" />
    <item android:drawable="@drawable/battery_full" android:maxLevel="100" />
</level-list>

Transition Drawables

TransitionDrawable enables cross-fade animations between two drawable resources.

File Location: res/drawable/filename.xml
Compiled Resource: Resource pointer to TransitionDrawable
Resource Reference:

  • Java: R.drawable.filename
  • XML: @[package:]drawable/filename

Syntax:

<?xml version="1.0" encoding="utf-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/first_image" />
    <item android:drawable="@drawable/second_image" />
</transition>

Example:

// Java
TransitionDrawable transition = (TransitionDrawable) imageView.getDrawable();
transition.startTransition(300);

// Kotlin
val transition = imageView.drawable as TransitionDrawable
transition.startTransition(300)

Shape Drawables

Shape drawables define geometric shapes with colors, gradients, and strokes in XML files.

File Location: res/drawable/filename.xml
Compiled Resource: Resource pointer to GradientDrawable
Resource Reference:

  • Java: R.drawable.filename
  • XML: @[package:]drawable/filename

Syntax:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape=["rectangle" | "oval" | "line" | "ring"] >
    <gradient
        android:angle="integer"
        android:startColor="color"
        android:endColor="color"
        android:type=["linear" | "radial" | "sweep"] />
    <corners android:radius="dimension" />
    <stroke
        android:width="dimension"
        android:color="color" />
    <solid android:color="color" />
</shape>

Example:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="#FF3366CC"
        android:endColor="#FF003366"
        android:angle="90"/>
    <corners android:radius="12dp" />
    <stroke android:width="2dp" android:color="#FFFFFFFF" />
</shape>

Tags: Android Drawable Resources Bitmap NinePatch

Posted on Mon, 01 Jun 2026 16:45:40 +0000 by maliary