Sunday, September 18

Tabs at the bottom of TabActivity

Tabs at the bottom of TabActivity

By default tabs in Android are displayed at the top. It is a general guideline for android developers to keep the tabs at top of the Tabs based application since lot of Android mobiles are having their home, back,search buttons or touch interface at the bottom

But its purely our decision :)

There are two ways to achieve this.
  1. Using RelativeLayout
  2. Using "android:layout_weight" attibute
 1) Using RelativeLayout: .xml will look like the following.
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <RelativeLayout
        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:layout_alignParentTop="true"
             android:layout_above="@android:id/tabs" />
    <TabWidget android:id="@android:id/tabs"
             android:layout_width="fill_parent"
             android:layout_height="wrap_content"
             android:layout_alignParentBottom="true" />
    </RelativeLayout>
</TabHost>

2)  Using "android:layout_weight" attibute
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:padding="5dp">

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:layout_weight="1"/>

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0"/>
    </LinearLayout>
</TabHost>
  

I have  used both approaches in my application. It is working fine without any problem.

5 comments:

Srikanth Gutti said...

Thank you soo much..

Angel H. said...

Muchisimas Gracias!!!!

Bynu Kaveenda Lorenzuhewa said...

Thanks bro'''

Brian Murphy said...

This did not work when using "android.support.v4.app.FragmentTabHost" as a TabHost.

Arief Mochammad Rachman said...

thx.. its helpfully