Present screen with many tabs

We want app screen display many tabs on top.

We will create a screen with 3 tabs, with a text line and button inside.

Xml file will like this.

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

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

android:id="@+id/tabhost"

android:layout_width="fill_parent"

android:layout_height="fill_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" >

   <LinearLayout

    android:id="@+id/l"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:orientation="vertical" >

 <TextView

 android:id="@+id/tv"

 android:layout_width="wrap_content"

 android:layout_height="wrap_content"

 android:layout_gravity="center_horizontal"

 android:layout_marginTop="5dp"

 android:text="This is tab1"

 android:textColor="#800000"

 android:textSize="20sp" />

 <Button

  android:id="@+id/bu1"

  android:layout_width="80dp"

 android:layout_height="40dp"

  android:layout_gravity="center_horizontal"

  android:layout_marginBottom="5dp"

android:background="@drawable/back2"

 android:text="Button 1"

  android:textColor="#0000cd"

  android:textSize="3mm" />

  </LinearLayout>

  <LinearLayout

   android:id="@+id/l2"

   android:layout_width="fill_parent"

   android:layout_height="fill_parent"

   android:orientation="vertical" >

   <TextView

    android:id="@+id/tv2"

   android:layout_width="wrap_content"

 android:layout_height="wrap_content"

  android:layout_gravity="center_horizontal"

  android:layout_marginTop="5dp"

android:text="This is tab2"

   android:textColor="#800000"

   android:textSize="20sp" />

<Button

 android:id="@+id/bu2"

android:layout_width="80dp"

 android:layout_height="40dp"

android:layout_gravity="center_horizontal"

android:layout_marginBottom="5dp"

 android:background="@drawable/back2"

   android:text="Button 2"

  android:textColor="#0000cd"

  android:textSize="3mm" />

 </LinearLayout>

 <LinearLayout

  android:id="@+id/l3"

 android:layout_width="fill_parent"

  android:layout_height="fill_parent"

 android:orientation="vertical" >

<TextView

  android:id="@+id/tv3"

  android:layout_width="wrap_content"

  android:layout_height="wrap_content"

  android:layout_gravity="center_horizontal"

  android:layout_marginTop="5dp"

android:text="This is tab3"

  android:textColor="#800000"

 android:textSize="20sp" />

<Button

android:id="@+id/bu3"

android:layout_width="80dp"

 android:layout_height="40dp"

android:layout_gravity="center_horizontal"

android:layout_marginBottom="5dp"

android:background="@drawable/back2"

 android:text="Button 3"

 android:textColor="#0000cd"

 android:textSize="3mm" />

 </LinearLayout>

</FrameLayout>

 </LinearLayout>

</TabHost>

In code, copy these line to below setContentView.

TabHost tabs=(TabHost)findViewById(R.id.tabhost);      

         tabs.setup();

         

       TabHost.TabSpec spec=tabs.newTabSpec("tag1");         

       spec.setContent(R.id.l);      

       spec.setIndicator("Tab 1");

       tabs.addTab(spec);

         

       spec=tabs.newTabSpec("tag2");

       spec.setContent(R.id.l2);     

       spec.setIndicator("Tab 2");

       tabs.addTab(spec);

       spec=tabs.newTabSpec("tag3");

       spec.setContent(R.id.l3);     

       spec.setIndicator("Tab 3");

       tabs.addTab(spec);

Declare buttons, textViews, set address.

tv = (TextView)findViewById(R.id.tv);

tv2 = (TextView)findViewById(R.id.tv2);

tv3 = (TextView)findViewById(R.id.tv3);

b1 = (Button) findViewById(R.id.bu1);

b2 = (Button) findViewById(R.id.bu2);

b3 = (Button) findViewById(R.id.bu3);

b1.setOnClickListener(new View.OnClickListener() {

     @Override

     public void onClick(View v) {

     tv.setText("Button clicked tab1");              

             }

          });     

b2.setOnClickListener(new View.OnClickListener() {

     @Override

     public void onClick(View v) {

     tv2.setText("Button clicked tab2");                  

            }

          });

b3.setOnClickListener(new View.OnClickListener() {

     @Override

public void onClick(View v) {

     tv3.setText("Button clicked tab3");                  

             }

          });

Run to see the result.

This way good when we want to use only one class to control all parts of app.