Skip to content

Drawables

Jump to bottom
Orim Dominic Adah edited this page Dec 8, 2018 · 92 revisions

Overview

A drawable resource is a general concept for a graphic that can be drawn to the screen. Drawables are used to define shapes, colors, borders, gradients, etc. which can then be applied to views within an Activity.

This is typically used for customizing the view graphics that are displayed within a particular view or context. Drawables tend to be defined in XML and can then be applied to a view via XML or Java.

Usage

Drawables can be an initially overwhelming topic because there are many drawable types used in different situations such as drawing shapes, setting state behaviors for buttons, creating stretchable button backgrounds and creating compound drawable layers.

There are at least 17 types of drawables but there are five that are most important to understand:

  1. Shape Drawables - Defines a shape with properties such as stroke, fill, and padding
  2. StateList Drawables - Defines a list of drawables to use for different states
  3. LayerList Drawables - Defines a list of drawables grouped together into a composite result
  4. NinePatch Drawables - A PNG file with stretchable regions to allow proper resizing
  5. Vector Drawables - Defines complex XML-based vector images

Let's explore these drawable file types one by one and take a look at examples of usage.

Drawing Shapes

The Shape Drawable is an XML file that defines a geometric shape, including colors and gradients. This is used to create a complex shape that can then be attached as the background of a layout or a view on screen. For example, you can use a shape drawable to change the shape, border, and gradient of a button background.

A shape is simply a collection of properties that are combined to describe a background. The shape can be described with properties such as corners for rounding, gradient for backgrounds, padding for spacing, solid for background colors, and stroke for border.

Solid Color Shapes

Here's an example of drawing a rounded rectangle with a border in res/layout/drawable/solid_color_shape.xml:

<?xml version="1.0" enc

Created by CodePath with much help from the community. Contributed content licensed under cc-wiki with attribution required. You are free to remix and reuse, as long as you attribute and use a similar license.

Finding these guides helpful?

We need help from the broader community to improve these guides, add new topics and keep the topics up-to-date. See our contribution guidelines here and our topic issues list for great ways to help out.

Check these same guides through our standalone viewer for a better browsing experience and an improved search. Follow us on twitter @codepath for access to more useful Android development resources.

Clone this wiki locally