In this unit we will discuss about the Drawable Resource and Layout Resources. A drawable resource is a general concept for a graphic that can be drawn to the screen and which you can retrieve with APIs. A layout resource defines the architecture for the UI in an Activity or a component of a UI.

1. Unit 11
Drawable Resource and Layout Resource
By
Dr. Ramkumar Lakshminarayanan
Introduction
In this unit we will discuss about the Drawable Resource and Layout Resources. A
drawable resource is a general concept for a graphic that can be drawn to the screen and which
you can retrieve with APIs. A layout resource defines the architecture for the UI in an Activity
or a component of a UI.
Drawable Resource
In Drawable Resource use APIs such as getDrawable(int) or apply to another XML
resource with attributes such as android:drawable and android:icon. There are several different
types of drawables:
 Bitmap File
 Nume-Patch File
 Layer List
 State List
 Level List
 Transistion Drawable
 Insert Drawable
 Clip Drawable
 Scale Drawable
 Shape Drawable
Bitmap File
A bitmap graphic file (.png, .jpg, or .gif). Creates a BitmapDrawable. A Drawable that
wraps a bitmap and can be tiled, stretched, or aligned. You can create a BitmapDrawable from a
file path, an input stream, through XML inflation, or from a Bitmap object. It can be defined in
an XML file with the <bitmap> element.
Nine-Patch File
A PNG file with stretchable regions to allow image resizing based on content (.9.png).
Creates a NinePatchDrawable.

2. Layer List
A Drawable that manages an array of other Drawables. These are drawn in array order, so
the element with the largest index is be drawn on top. Creates a LayerDrawable. It can be
defined in an XML file with the <layer-list> element. Each Drawable in the layer is defined in a
nested <item>
State List
An XML file that references different bitmap graphics for different states (for example, to
use a different image when a button is pressed). Creates a StateListDrawable. It can be defined in
an XML file with the <selector> element. Each state Drawable is defined in a nested <item>
element
Level List
An XML file that defines a drawable that manages a number of alternate Drawables, each
assigned a maximum numerical value. Creates a LevelListDrawable.
Transition Drawable
An XML file that defines a drawable that can cross-fade between two drawable
resources. Creates a TransitionDrawable. To start the transition, call startTransition(int). To display
just the first layer, call resetTransition(). It can be defined in an XML file with the <transition>
element. Each Drawable in the transition is defined in a nested <item>
Inset Drawable
An XML file that defines a drawable that insets another drawable by a specified distance.
This is useful when a View needs a background drawble that is smaller than the View's actual
bounds.
Clip Drawable
An XML file that defines a drawable that clips another Drawable based on this
Drawable's current level value. Creates a ClipDrawable. You can control how much the child
Drawable gets clipped in width and height based on the level, as well as a gravity to control
where it is placed in its overall container. Most often used to implement things like progress bars,
by increasing the drawable's level with setLevel().
Scale Drawable
An XML file that defines a drawable that changes the size of another Drawable based on
its current level value. Creates a ScaleDrawable. You can control how much the child Drawable
changes in width and height based on the level, as well as a gravity to control where it is placed

3. in its overall container. Most often used to implement things like progress bars. It can be defined
in an XML file with the <scale> element.
Shape Drawable
An XML file that defines a geometric shape, including colors and gradients. Creates a
ShapeDrawable. If no Shape is given, then the ShapeDrawable will default to a RectShape. This
object can be defined in an XML file with the <shape> element.
In Android you can use Shape Drawables to define background, borders and gradients for
your Views.
To define a shape create a XML file in your drawable folder. For example:
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<stroke android:width="2dp" android:color="#FFFFFFFF" />
<gradient android:startColor="#DD000000" android:endColor="#DD2ECCFA"
android:angle="225"/>
<corners android:bottomRightRadius="7dp" android:bottomLeftRadius="7dp"
android:topLeftRadius="7dp" android:topRightRadius="7dp"/>
</shape>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/myshape">
<EditText android:layout_width="fill_parent" android:text="1"
android:layout_height="wrap_content" android:id="@+id/editText1"
android:inputType="numberSigned"
android:layout_margin="5dip" android:gravity="center">
<requestFocus></requestFocus>
</EditText>
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content" android:id="@+id/button1"
android:text="@string/start"></Button>
</LinearLayout>

4. Figure 11.1 Output using Drawable Resource
Figure 11.1 Output without Drawable Resource

5. Layout Resource
We have seen some examples for using Layout in our application in previous units. In
this unit we are going to discuss about the general syntax and the various options provided by
android sdk.
A layout resource defines the architecture for the UI in an Activity or a component of a UI.
file location:
res/layout/filename.xml
The filename will be used as the resource ID.
compiled resource datatype:
Resource pointer to a View (or subclass) resource.
resource reference:
In Java: R.layout.filename
In XML: @[package:]layout/filename
Syntax:
<?xml version="1.0" encoding="utf-8"?>
<ViewGroup xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@[+][package:]id/resource_name"
android:layout_height=["dimension" | "fill_parent" | "wrap_content"]
android:layout_width=["dimension" | "fill_parent" | "wrap_content"]
[ViewGroup-specific attributes] >
<View
android:id="@[+][package:]id/resource_name"
android:layout_height=["dimension" | "fill_parent" | "wrap_content"]
android:layout_width=["dimension" | "fill_parent" | "wrap_content"]
[View-specific attributes] >
<requestFocus/>
</View>
<ViewGroup >
<View />
</ViewGroup>
<include layout="@layout/layout_resource"/>
</ViewGroup>

6. <ViewGroup>
A container for other View elements. There are many different kinds of ViewGroup objects and
each one lets you specify the layout of the child elements in different ways. Different kinds of
ViewGroup objects include LinearLayout, RelativeLayout, and FrameLayout.
You should not assume that any derivation of ViewGroup will accept nested Views. Some
ViewGroups are implementations of the AdapterView class, which determines its children only
from an Adapter.
Attributes
android:id
Resource ID. A unique resource name for the element, which you can use to obtain a reference to
the ViewGroup from your application.
android:layout_height
Dimension or keyword. Required. The height for the group, as a dimension value (or dimension
resource) or a keyword ("fill_parent" or "wrap_content").
android:layout_width
Dimension or keyword. Required. The width for the group, as a dimension value (or dimension
resource) or a keyword ("fill_parent" or "wrap_content"). More attributes are supported by the
ViewGroup base class, and many more are supported by each implementation of ViewGroup.
<View>
An individual UI component, generally referred to as a "widget". Different kinds of View objects
include TextView, Button, and CheckBox.
<requestFocus>
Any element representing a View object can include this empty element, which gives it's parent
initial focus on the screen. You can have only one of these elements per file.
<include>

7. Includes a layout file into this layout.
layout
Used to define the Layout resource.
Summary
In this unit we have discussed about the drawable and layout resources. These drawables offer a
wide range of flexibility and are a very powerful tool that are often under-utilized. Layout
resource is the basic of designing any android application. In this unit we have discussed the
syntax of it and the usage of the attributes. In the next unit we will discuss about the Style
Resources and other resources supported by Android SDK.