How to move Android tabs from top to bottom

  • SumoMe

Today I will show how to move tabs from top to bottom of the application. This is the layout:

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <RelativeLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:padding="5dp"
        />
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:gravity="bottom"
            android:layout_alignParentBottom="true"
        />
    </RelativeLayout>
</TabHost>

And this is the Tabs class:

package com.lardev.tabs;

import android.app.TabActivity;
import android.content.Intent;
import android.content.res.Resources;
import android.os.Bundle;
import android.widget.TabHost;

public class Tabs extends TabActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        setContentView(R.layout.tabs);

        Resources res = getResources(); // Resource object to get Drawables
        TabHost tabHost = getTabHost();  // The activity TabHost
        TabHost.TabSpec spec;  // Resusable TabSpec for each tab
        Intent intent;  // Reusable Intent for each tab

        // Create an Intent to launch an Activity for the tab (to be reused)
        intent = new Intent().setClass(this, Search.class);

        // Initialize a TabSpec for each tab and add it to the TabHost
        spec = tabHost.newTabSpec("search").setIndicator("Search",
                          res.getDrawable(R.drawable.ic_tab_search))
                      .setContent(intent);
        tabHost.addTab(spec);

        // Points tabs
        intent = new Intent().setClass(this, Points.class);
        spec = tabHost.newTabSpec("points").setIndicator("Points",
                          res.getDrawable(R.drawable.ic_tab_search))
                      .setContent(intent);
        tabHost.addTab(spec);

        // Social tabs
        intent = new Intent().setClass(this, Social.class);
        spec = tabHost.newTabSpec("social").setIndicator("Social",
                          res.getDrawable(R.drawable.ic_tab_search))
                      .setContent(intent);
        tabHost.addTab(spec);

        // Contact tabs
        intent = new Intent().setClass(this, Contact.class);
        spec = tabHost.newTabSpec("contact").setIndicator("Contact",
                          res.getDrawable(R.drawable.ic_tab_search))
                      .setContent(intent);
        tabHost.addTab(spec);

        tabHost.setCurrentTab(0);

    }
}

And the result is:

Android tabs from top to bottom

More info about Tab Layout you can read from here: Tab layout read

2 thoughts on “How to move Android tabs from top to bottom”

  1. Dear ,
    Any help for my query?

    1. To create Tab along with IMAGE BUTTON in single Line.
    2. ONLY TAB is Horizontally Scrollable but image button is fixed at the right extreme.

    TAB | TAB | TAB | TAB | TAB | (+)<–Fixed image button
    ——Scrollable —————

    Best Regards
    Vinod

Leave a Reply


*