How to make Tabs UI with icons


SDK Version: 
M3

So here's how it's going to be look like:

Your class has to extend TabActivity:

  1. public class YourClass extends TabActivity {
  2. ...
  3. ...
  4. }

After that, here's how to configure a Tab:
1. Create a LinearLayout in your main.xml, with the id: "TabOne"
2. Paste these lines after onCreate() :

  1. /* TAB  #1 */
  2. TabSpec tsTabOne = mTabHost.newTabSpec("TabOne");
  3. tsBrand.setIndicator("Tab One"), getResources().getDrawable(R.drawable.tab_one));          
  4. tsTabOne.setContent(R.id.TabOne);

3. You have to create tab_one.xml in /res/drawable folder, with the following:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <selector xmlns:android="http://schemas.android.com/apk/res/android">
  3.     <!-- When selected, use this -->
  4.     <item android:drawable="@drawable/tab_one_icon&quot;
  5.           android:state_selected="true" />
  6.     <!-- When not selected, use that-->
  7.     <item android:drawable="@drawable/tab_one_iconfaded" />
  8. </selector>

As you can see, you'll need 2 icons/tab, a normal, and a faded one.
Copy those images to "/res/drawables/" folder too, with a name like "tab_one_icon.png", or "tab_one_iconfaded.png".

4. Ok, now repeat these 3 steps above, as manytimes, as many Tabs you would like to have.

5. Final Step, paste the following:

  1. /* Create TabHost */
  2. TabHost mTabHost;
  3. mTabHost = getTabHost();
  4. /* Add Tabs to TabHost */
  5. mTabHost.addTab(tsTabOne);
  6. ... /* If you have more ... */
  7. mTabHost.setCurrentTab(0);