Create a new Android project, CustomizingComponents.

As an example, we will perform the transformation of a button. First, create your three images corresponding to the button being pressed, focused, and normal, and then add them to the Drawable resources. Then, create a new layout named customizedButton.axml under the Resource/Layout folder. This file will look like the following code sample that defines the images corresponding to the three states:

<?xml version="1.0" encoding="utf-8"?>
<selector>
  <item android:drawable="@drawable/pressed_state"
    android:state_pressed="true" />
  <item android:drawable="@drawable/focused_state "
    android:state_focused="true" />
  <item android:drawable="@drawable/normal_state " />
</selector>

To use this new customize button in your activities, you just have to add the background attribute to an existing button. As a value, this background attribute should have the layout that we created for customized buttons. Hence, the Go! button that we used in RelativeLayout will now have the shape shown by the following code sample and will be placed in your activity layout.axml file:

<Button
  android:id="@+id/button1"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_below="@id/editText1"
  android:layout_alignParentRight="true"
  android:layout_marginLeft="10dip"
  android:background="@layout/customizedButton"
android:text="GO" />

While hanging around with the tabbed layout, we saw that subactivities understand activities that are embedded in a tabbed one, and they own a .xaml file containing a <selector> tag instead of classical layout ones. Using the selector tag, you can, for example, override the way the button looks by creating a new .xaml file composed of android:drawable and android:state respectively, for the image of the button and the state in which this image applies.

See also the next chapter to use new components capable of playing audio and video.