Android TabWidget White Space Issue

Question

I am working on the TabWidget and i am getting a white space between the TabActivity and the Tabs.

I don't know how to remove this white space please can any one help me out how should i remove it, my tab_main.xml is as follows :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >

<TabHost
    android:id="@android: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" >

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="0dip"
            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 tried to put background color of TabWidget to android:color:transparent but still same white space comes between the Activity and the Tab.

I do not want any separation space between my Activity and the Tabs (Is it possible to do it?)

Please can any one suggest me how to get rid of this white space.

Answer 1

The output you've shown most likely suggests a Margin/Padding error, rather than a layout error. Either your TabWidget or your FrameLayout could have a margin getting inherited by the overall theme that you're using.

Most likely the following will fix the problem (note the extra margin/padding styles):

        <FrameLayout
            android:layout_marginBottom="0dip"
            android:layout_paddingBottom="0dip"
            android:background="@android:color/holo_green_light"
            android:id="@android:id/tabcontent"
            ....
            .... />

        <TabWidget
            android:layout_marginTop="0dip"
            android:layout_paddingTop="0dip"
            android:background="@android:color/holo_blue_light"
            android:id="@android:id/tabs"
            ....
            .... />

Your FrameLayout could also have any nested components which have a margin/padding, and which in turn may cause the white space. I've added the android:background to both the FrameLayout and the TabWidget, just to help troubleshoot if there is any white space in between.

You said that you've tried putting background color of the TabWidget to transparent - but it won't help, because if there is a margin - then the underlying activity's background color shows up as white, below the transparent area. If you set the overall RelativeLayout's background color to something like blue - then you will see the blue coming through. So fix the margin/padding rather than trying to hide it.