1. Drawable Resources
There are several different types of drawables as follow
2. Bitmap
A bitmap image. Android supports bitmap files in a three formats: .png
(preferred), .jpg
(acceptable), .gif
(discouraged).
Bitmap files may be automatically optimized with lossless image compression by the aapt
tool during the build process.
If you plan on reading an image as a bit stream in order to convert it to a bitmap, put your images in the res/raw/
folder instead, where
they will not be optimized.
3. Nine-Patch
A NinePatch
is a PNG image in which you can define stretchable regions that Android scales when content within the View exceeds the normal
image bounds. You typically assign this type of image as the background of a View that has at least one dimension set to "wrap_content"
,
and when the View grows to accomodate the content, the Nine-Patch image is also scaled to match the size of the View. An example
use of a Nine-Patch image is the background used by Android's standard Button
widget, which must stretch to accommodate the text
(or image) inside the button.
4. Layer List
A LayerDrawable
is a drawable object that manages an array of other drawables. Each drawable in the list is drawn in the order of the list
—the last drawable in the list is drawn on top.
//res/drawable/layers.xml <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <bitmap android:src="@drawable/android_red" android:gravity="center" /> </item> <item android:top="10dp" android:left="10dp"> <bitmap android:src="@drawable/android_green" android:gravity="center" /> </item> <item android:top="20dp" android:left="20dp"> <bitmap android:src="@drawable/android_blue" android:gravity="center" /> </item> </layer-list>
This layout XML applies the drawable to a View:
<ImageView android:layout_height="wrap_content" android:layout_width="wrap_content" android:src="@drawable/layers" />
The result is a stack of increasingly offset images:
5. State List
A StateListDrawable
is a drawable object defined in XML that uses a several different images to represent the same graphic, depending
on the state of the object
//res/drawable/button.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:state_hovered="true" android:drawable="@drawable/button_focused" /> <!-- hovered --> <item android:drawable="@drawable/button_normal" /> <!-- default --> </selector>
<Button android:layout_height="wrap_content" android:layout_width="wrap_content" android:background="@drawable/button" />
6. Transition Drawable
A TransitionDrawable
is a drawable object that can cross-fade between the two drawable resources.
Each drawable is represented by an <item>
element inside a single <transition>
element. No more than two items are supported. To
transition forward, call startTransition()
. To transition backward, call reverseTransition()
.
//res/drawable/transition.xml <?xml version="1.0" encoding="utf-8"?> <transition xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/on" /> <item android:drawable="@drawable/off" /> </transition>
<ImageButton android:id="@+id/button" android:layout_height="wrap_content" android:layout_width="wrap_content" android:src="@drawable/transition" />
//And the following code performs a 500ms transition from the first item to the second: ImageButton button = (ImageButton) findViewById(R.id.button); TransitionDrawable drawable = (TransitionDrawable) button.getDrawable(); drawable.startTransition(500);
7. ...