TabLayout/TabHost Tutorial For Android (Reusing Layout)

Hi, hope you all are fine. My this tutorial is about using Tab Layout in Android.

 

Here its complete source code.

TabBarExample.java

In this class i take the reference of TabHost and pass it to setMyTabs Function to add Tabs at runtime.

public class TabBarExample extends TabActivity  {

	TabHost tabHost;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.tab);

        tabHost = (TabHost)findViewById(android.R.id.tabhost);
        AppTabs.setMyTabs(tabHost, this);
    }
}

AppTabs.java
First create the TabSpec objects, setting their ids, setting Display Text and Animation (for pressed and unpressed states), setting their contents then add add them into tabHost.

We can also implement OnTabChangedListener, and set backgrounds of tabs as required whose code is highlighted.

	public static void setMyTabs(TabHost tabHost, Context context){
        TabSpec firstTabSpec = tabHost.newTabSpec("tid1");
        TabSpec secondTabSpec = tabHost.newTabSpec("tid1");

        firstTabSpec.setIndicator("Artists", context.getResources().getDrawable(R.anim.artists));
        secondTabSpec.setIndicator("Search", context.getResources().getDrawable(R.anim.search));

        firstTabSpec.setContent(new Intent(context, FirstTab.class));
        secondTabSpec.setContent(new Intent(context, SecondTab.class));

        tabHost.addTab(firstTabSpec);
        tabHost.addTab(secondTabSpec);

        tabHost.getTabWidget().setCurrentTab(1);
        tabHost.setOnTabChangedListener(MyOnTabChangeListener);

        // Setting BackGround
//      for(int i=0; i<tabHost.getTabWidget().getChildCount(); i++)
//      {
//      	tabHost.getTabWidget().getChildAt(i).setBackgroundColor(Color.WHITE);
//      }
//
//      tabHost.getTabWidget().setCurrentTab(1);
//      tabHost.getTabWidget().getChildAt(1).setBackgroundColor(Color.GRAY);

	}

	private static OnTabChangeListener MyOnTabChangeListener = new OnTabChangeListener(){
		@Override
		public void onTabChanged(String tabId) {
//			for(int i=0;i<tabHost.getTabWidget().getChildCount();i++)
//	        {
//	        	tabHost.getTabWidget().getChildAt(i).setBackgroundColor(Color.WHITE);
//	        }
//
//			tabHost.getTabWidget().getChildAt(tabHost.getCurrentTab()).setBackgroundColor(Color.GRAY);
		}
	};

}

Tab.xml

<TabHost android:layout_width="fill_parent"
	android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android"
	android:id="@android:id/tabhost">
	<LinearLayout android:id="@+id/LinearLayout01"
		android:orientation="vertical" android:layout_height="fill_parent"
		android:layout_width="fill_parent">
		<TabWidget android:id="@android:id/tabs"
			android:layout_height="wrap_content" android:layout_width="fill_parent"></TabWidget>
		<FrameLayout android:id="@android:id/tabcontent"
			android:layout_height="fill_parent" android:layout_width="fill_parent"></FrameLayout>
	</LinearLayout>
</TabHost>

FirstTab.java

public class FirstTab extends Activity {
	/** Called when the activity is first created. */
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);

		TextView textView = new TextView(this);
		textView.setText("First Tab");
		setContentView(textView);
	}
}

Other Links

http://developer.android.com/resources/tutorials/views/hello-tabwidget.html