TabHost is a layout or container class used for a tab layout view. The tabbed window view allows you navigate from one tab or page to another tab or page in a single activity. The TabHost object holds two children: a set of tab labels that the user clicks to select a specific tab, and a FrameLayout object that displays the contents of that tab. In this tutorial, the contents of the tabs are in fragments. The fragments are switched from one to another fragment when you select a tab.
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
>
<TabWidget android:id="@android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:paddingTop="50dip"
android:paddingLeft="10dip"
/>
</LinearLayout>
</TabHost>
Then you have to create two fragments: FragmentAccounts and FragmentSettings. They are the contents of the Accounts and Settings tabs respectively.
FragmentAccounts.java
package com.example.layoutexample;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class FragmentAccounts extends Fragment{
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
// Inflate the layout for this fragment
View view=inflater.inflate(R.layout.faccountlayout, container, false);
return view;
}
}
faccountlayout.xml file
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="You are on the Accounts tab."
/>
</LinearLayout>
fsettingslayout.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="You are on the Settings tab."
/>
</LinearLayout>
package com.example.layoutexample;
import android.os.Bundle;
import android.app.Activity;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentTransaction;
import android.view.Menu;
import android.view.View;
import android.widget.TabHost;
import android.widget.TabHost.OnTabChangeListener;
import android.widget.TabHost.TabSpec;
import android.widget.TabHost.TabContentFactory;
public class MainActivity extends FragmentActivity {
Activity context;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
context=this;
//reference to TabHost
TabHost th=(TabHost)findViewById(android.R.id.tabhost);
th.setup();
th.setOnTabChangedListener(new OnTabChangeListener(){
public void onTabChanged(String tabId) {
FragmentTransaction transact=getSupportFragmentManager().beginTransaction();
if(tabId.contains("Accounts")){
//show Accounts fragment
FragmentAccounts fa=new FragmentAccounts();
transact.replace(android.R.id.tabcontent, fa,"fa");
transact.addToBackStack(null);
transact.commit();
}
else{
//show Settings fragment
FragmentSettings fs=new FragmentSettings();
transact.replace(android.R.id.tabcontent, fs,"fs");
transact.addToBackStack(null);
transact.commit();
}
}
});
//create child tabs
TabSpec tab1 = th.newTabSpec("Accounts Tab");
TabSpec tab2 = th.newTabSpec("Settings Tab");
//set labels, icons, and activities to open
tab1.setIndicator("Accounts", getResources().getDrawable(R.drawable.user_con));
tab1.setContent(new TContent());
tab2.setIndicator("Settings", getResources().getDrawable(R.drawable.setting_icon));
tab2.setContent(new TContent());
//add tabs to the TabHost
th.addTab(tab1);
th.addTab(tab2);
th.setCurrentTab(1);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
//Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
class TContent implements TabContentFactory{
TContent(){
}
public View createTabContent(String tag) {
View tv=new View(context);
return tv;
}
}
}
You need to images in your res/drawable folder. They are user_icon.png and setting_icon.png.

Posted by: Dara | post date: 08-19-2014 | Subject: Android Apps Development
|
This website intents to provide free and high quality tutorials, examples, exercises and solutions, questions and answers of programming and scripting languages:
C, C++, C#, Java, VB.NET, Python, VBA,PHP & Mysql, SQL, JSP, ASP.NET,HTML, CSS, JQuery, JavaScript and other applications such as MS Excel, MS Access, and MS Word. However, we don't guarantee all things of the web are accurate. If you find any error, please report it then we will take actions to correct it as soon as possible.