How to style the divider between Ice Cream Sandwich tabs? How to style the divider between Ice Cream Sandwich tabs? android android

How to style the divider between Ice Cream Sandwich tabs?


After removing every style I use I got the following image:

enter image description here

This image also contains the small gaps. Therefore it seems that this is some kind of default behavior.

However I found a way to work around the problem. I set the redline as a standard Background for the whole tabbar. This way the gap appears but nobody can see it because the background, that already contains the line is shown.

I now use the following style for all my activities:

<style name="LightThemeSelector" parent="android:Theme.Holo.Light">    <item name="android:actionBarTabBarStyle">@style/customTabBar</item>    <item name="android:actionBarTabStyle">@style/customTabStyle</item></style>

This style is used to style each single tab inside the tabbar:

<style name="customTabStyle" parent="@android:style/Widget.Holo.ActionBar.TabView">    <item name="android:showDividers">none</item>    <item name="android:measureWithLargestChild">true</item>    <item name="android:background">@drawable/tab_line</item>    <item name="android:gravity">center</item></style>

To style the whole Tabbar i use the following style:

<style name="customTabBar" parent="@android:style/Widget.Holo.ActionBar.TabBar">    <item name="android:showDividers">middle</item>    <item name="android:divider">@drawable/divider</item>    <item name="android:dividerPadding">0dp</item>    <item name="android:background">@drawable/tab_unselected</item></style>

This style defines my custom divider and also defines the background for the tabbar. As background I directly set the nine patch drawable that is drawn if a tab is not selected.The result of all this is a tabbar with a red underline without any gaps.

enter image description here


Here you go.

<style name="YourTheme" parent="@android:style/Theme.Holo.Light">    <item name="android:actionBarTabBarStyle">@style/Divider</item></style><style name="Divider" parent="@android:style/Widget.Holo.ActionBar.TabBar">    <item name="android:divider">@drawable/your_divider_drawable_here</item>    <item name="android:showDividers">middle</item>    <item name="android:dividerPadding">12dip</item></style>


<style name="AppTheme" parent="AppBaseTheme">    <item>......    </item>    <item name="android:actionBarDivider">@null</item></style>

here @null is for not to provide any dividerand if you want to customize your divider than use @drawable/your_divider_image