Merge "cherry-pick from master: c096a9ae (plus...

</pre>

  <p>Notice that this doesn't use a layout file. Just create a {@link

android.widget.TextView}, give it some text and set that as the content. Duplicate this for

each of the three activities.</p>

  <li>You're going to need an icon for each of your tabs. And for each one, you should create an 

image for two different states: one for when the tab is selected, and one for when it is not. The

general design recommendation is for the selected tab icon to be a darker color (grey), and the

non-selected icon to be lighter (white). For example:

each of the three activities, and add the corresponding <code>&lt;activity/&gt;</code> tags to the Android Manifest file.</p>

  <li>You need an icon for each of your tabs. For each icon, you should create two versions: one

for when the tab is selected and one for when it is unselected. The

general design recommendation is for the selected icon to be a dark color (grey), and the

unselected icon to be a light color (white). (See the <a

href="{@docRoot}guide/practices/ui_guidelines/icon_design.html#tabstructure">Icon Design

Guidelines</a>.) For example:

  <p>

  <img src="images/ic_tab_artists_white.png" title="ic_tab_artists_white.png"  alt="" />

  <img src="images/ic_tab_artists_grey.png" title="ic_tab_artists_grey.png" alt="" />

  <img src="images/ic_tab_artists_white.png" title="unselected tab icon"  alt="" />

  <img src="images/ic_tab_artists_grey.png" title="selected tab icon" alt="" />

  </p>

  <p>Copy these images for use in this tutorial. Save them into your project

<code>res/drawable/</code> directory. You now need to create a {@link

android.graphics.drawable.Drawable} with XML that specifies which image

to use for each state. Create a new file in <code>res/drawable/</code> named

<code>ic_tab_artists.xml</code> and insert the following:</p>

  <p>For this tutorial, you can copy these images and use them for all three tabs. (When you

create tabs in your own application, you should create customized tab icons.)</p>

  <p>Now create a <a

href="{@docRoot}guide/topics/resources/drawable-resource.html#StateList">state-list drawable</a>

that specifies which image to use for each tab state:</p>

  <ol>

    <li>Save the icon images in your project <code>res/drawable/</code> directory.</li>

    <li>Create a new XML file in <code>res/drawable/</code>

named <code>ic_tab_artists.xml</code> and insert the following:

<pre>

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/ic_tab_artists_white" />

</selector>

</pre>

  <p>This is an XML definition for a {@link android.graphics.drawable.Drawable}, which you will

reference as the image for a tab. When the image state changes, the image will automatically

switch between the images defined here.</p>

  <p>This is a <a

href="{@docRoot}guide/topics/resources/drawable-resource.html#StateList">state-list drawable</a>,

which you will apply as the tab image. When the tab state changes, the tab icon will

automatically switch between the images defined here.</p>

    </li>

  </ol>

  </li>

  <li>Open the <code>res/layout/main.xml</code> file and insert the following:

  <pre>

            android:id="@android:id/tabcontent"

            android:layout_width="fill_parent"

            android:layout_height="fill_parent"

            android;padding="5dp" />

            android:padding="5dp" />

    </LinearLayout>

</TabHost>

</pre>

    spec = tabHost.newTabSpec("albums").setIndicator("Albums",

                      res.getDrawable(R.drawable.ic_tab_albums))

                  .setContent(intent);

    mTabHost.addTab(spec);

    tabHost.addTab(spec);

    intent = new Intent().setClass(this, SongsActivity.class);

    spec = tabHost.newTabSpec("songs").setIndicator("Songs",

                  .setContent(intent);

    tabHost.addTab(spec);

    tabHost.setCurrentTab(getIntent());

    tabHost.setCurrentTab(2);

}

</pre>

    <p>This sets up each tab with their text and icon, and assigns each one an {@link

{@link android.widget.TabHost.TabSpec}, {@link

android.widget.TabHost.TabSpec#setIndicator(CharSequence,Drawable)} is called to set the text and

icon for the tab, and {@link android.widget.TabHost.TabSpec#setContent(Intent)} is called to specify

the {@link android.content.Intent} to opens the appropriate {@link android.app.Activity}. Each

the {@link android.content.Intent} to open the appropriate {@link android.app.Activity}. Each

{@link android.widget.TabHost.TabSpec} is then added to the {@link android.widget.TabHost} by

calling {@link android.widget.TabHost#addTab(TabHost.TabSpec)}.</p>

</ol>

<p>Your application should look like this:</p>

<p>Your application should look like this (though your icons may be different):</p>

<img src="images/hello-tabwidget.png" width="150px" />

<h3>References</h3>