How to style the divider between Ice Cream Sandwich tabs?
After removing every style I use I got the following image:
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.
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