Android: Tabs at the BOTTOM

llappall picture llappall · Mar 7, 2010 · Viewed 159.2k times · Source

I've seen some chatter about this, but nothing definite. Is there a way to put the tabs in a TabWidget to the bottom of the screen? If so, how?

I've tried the following, but didn't work:

a) setting the tabwidget below the framelayout
b) setting the tabwidget's gravity to "bottom"

Thanks! llappall

Answer

stormin986 picture stormin986 · Apr 26, 2010

Here's the simplest, most robust, and scalable solution to get tabs on the bottom of the screen.

  1. In your vertical LinearLayout, put the FrameLayout above the TabWidget
  2. Set layout_height to wrap_content on both FrameLayout and TabWidget
  3. Set FrameLayout's android:layout_weight="1"
  4. Set TabWidget's android:layout_weight="0" (0 is default, but for emphasis, readability, etc)
  5. Set TabWidget's android:layout_marginBottom="-4dp" (to remove the bottom divider)

Full code:

<?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"
            android:layout_marginBottom="-4dp"/>

    </LinearLayout>

</TabHost>