Develop Reference

Space between tabs in Android

I have space between my tabs. I looked at all the possible solutions on StackOverflow and added them but still the space exists between them.
My tab code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:gravity="center"
android:padding="0dp"
>
<ImageView
android:id="#+id/tab_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
My Layout with tabs:
<?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"
android:orientation="vertical" >
<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="fill_parent"
android:layout_weight="1" >
<FrameLayout
android:id="#+id/tab5"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" />
<FrameLayout
android:id="#+id/tab4"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" />
<FrameLayout
android:id="#+id/tab3"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" />
<FrameLayout
android:id="#+id/tab2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" />
<FrameLayout
android:id="#+id/tab1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" />
</FrameLayout>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_weight="0"
android:background="#drawable/bottom_image"
android:dividerPadding="0dp"
android:fitsSystemWindows="true"
android:gravity="fill"
android:showDividers="none"
android:tabStripEnabled="false"
android:visibility="visible" >
</TabWidget>
</LinearLayout>
</TabHost>
I added the following in code as well:
mTabHost.getTabWidget().setStripEnabled(false);
mTabHost.getTabWidget().setDividerDrawable(null);
if (Integer.parseInt(Build.VERSION.SDK) >= Build.VERSION_CODES.HONEYCOMB) {
mTabHost.getTabWidget().setShowDividers(LinearLayout.SHOW_DIVIDER_NONE);
}
But still it shows space between tabs. Am I missing something?

I have not got chances to check these from the android IDE. but I suppose this would work.
<?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"
android:orientation="vertical" >
<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="fill_parent">
<FrameLayout
android:id="#+id/tab5"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="20.0" />
<FrameLayout
android:id="#+id/tab4"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="20.0" />
<FrameLayout
android:id="#+id/tab3"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="20.0" />
<FrameLayout
android:id="#+id/tab2"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="20.0" />
<FrameLayout
android:id="#+id/tab1"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="20.0" />
</FrameLayout>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_weight="0"
android:background="#drawable/bottom_image"
android:dividerPadding="0dp"
android:fitsSystemWindows="true"
android:gravity="fill"
android:showDividers="none"
android:tabStripEnabled="false"
android:visibility="visible" >
</TabWidget>
Here, I have gave a weightSum = 100.0 and divided this equivalently to all the childs.

How to create scrollable tabs?

I am working to create scroll able tabs, please help me out, I am using below code, but not work for me
<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">
<HorizontalScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</HorizontalScrollView>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp" />
</LinearLayout>
</TabHost>
Please let me know specific answers

This Code work for 3.0 and higher versions :
<?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="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<HorizontalScrollView android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:scrollbars="horizontal"
>
<LinearLayout android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<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>
</HorizontalScrollView>
</LinearLayout>
</TabHost>
But not for lower versions,I need to make work for scrollable tabs for all devices

This is works for version 2.2+
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android1="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal"
android:orientation="vertical" xmlns:android="http://schemas.android.com/apk/res/android">
<TabHost
android1:id="#android:id/tabhost"
android1:layout_width="match_parent"
android1:layout_height="match_parent" >
<FrameLayout android:layout_width="fill_parent" android:layout_height="fill_parent">
<LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent">
<HorizontalScrollView android:scrollbars="none" android:layout_width="fill_parent" android:layout_height="wrap_content" android:fillViewport="true">
<TabWidget android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.0"
android:background="#drawable/tab_bg_unselected"/>
</HorizontalScrollView>
<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" />
</RelativeLayout>
</LinearLayout>
</FrameLayout>
</TabHost>

Android: ListView and TabWidget: The ListView goes over the TabWidget

I am using the TabWidget in my android project and I have a listView and a FrameLayout in the view. The problem is that when the ListView is higher than the screen height, the Tabs are invisible because the listview goes over the tabs.
I don't know how to set the listView above the tabs.
Here is my view:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<FrameLayout
android:id="#+id/frameLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="#ffffff"
android:minHeight="44dp" >
</FrameLayout>
<ListView
android:id="#+id/NewsCategorieslistView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:cacheColorHint="#00000000"
android:layout_below="#+id/frameLayout"
>
</ListView>
</RelativeLayout>
And here is my tab view:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:divider="#null" >
</TabWidget>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
</FrameLayout>
</RelativeLayout>
</TabHost>
Thank you very much.

I have found the solution:
<?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>

try this for your tab.xml( tab activity's layout)
<?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">
<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"
android:padding="5dp" />
</LinearLayout>
</TabHost>

TabWidget doesn't fill in HorizontalScrollView

I want to show tabs width horizontal scrollbar. I tried to implement like this How do you set tab view to scroll?
But the tabs doesn't fill the width.
How to fix it?
<?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">
<HorizontalScrollView
android:id="#+id/horizontalScrollView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
</TabWidget>
</LinearLayout>
</HorizontalScrollView>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</FrameLayout>
</LinearLayout>
<ProgressBar
android:id="#+id/destinationProgressBar"
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />
</TabHost>

Solved it! Use android:fillViewport="true" and remove LinearLayout.
<?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">
<HorizontalScrollView
android:id="#+id/horizontalScrollView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true">
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
</TabWidget>
</HorizontalScrollView>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</FrameLayout>
</LinearLayout>
<ProgressBar
android:id="#+id/destinationProgressBar"
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />
</TabHost>

placing tabs in bottom

hi i want place the tab widget in bottom of the screen i am using the below code .with that it displays in top can any one know the soution
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp"
android:layout_weight="1" android:gravity="bottom"/>
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content" android:gravity="bottom">
<TabWidget
android:id="#android:id/tabs"
android:gravity="bottom"
android:layout_width="500dp"
android:layout_height="wrap_content"
android:layout_weight="0"
android:scrollbars="horizontal"
/>
</HorizontalScrollView>

try this one....
<RelativeLayout android:id="#+id/LinearLayout02"
android:orientation="vertical" 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">
<TabWidget android:id="#android:id/tabs"
android:layout_width="fill_parent" android:layout_gravity="bottom" android:layout_height="wrap_content" />
<FrameLayout android:id="#android:id/tabcontent"
android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_marginBottom="80dip"
>
<LinearLayout android:id="#+id/LinearLayout01"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent" android:background="#E0FFFF">
</LinearLayout>
</FrameLayout>
</TabHost>
</RelativeLayout>