How to change ActionBar Tab bottom border and selected tab background?

Question

I have created clean app with fixed tabs and imported AppCompat, how to change active tab bottom border color and change clicked tab background?

This is what I want:

enter image description here

score 0 · Answer 1 · answered Jul 31 '13 at 13:34

0

Have a look at this Action Bar Style Generator http://jgilfelt.github.io/android-actionbarstylegenerator/

answered Jul 31 '13 at 13:34

Marcin S.

11,161
6
50
63

I saw this tool, but there is no way to set this border without images? – Damian Jul 31 '13 at 13:52
They are 9-patch images therefore it's best way of doing it. However also take a look at this post http://stackoverflow.com/questions/16139259/changing-actionbar-tabs-underline-color-progrmatically – Marcin S. Jul 31 '13 at 14:00
The best way? Are there other ways? Like: #MY-COLOR ? – Damian Jul 31 '13 at 14:19

score 0 · Answer 2 · answered Jul 31 '13 at 13:36

0

You have to make custom theme with required colors you can go following link to make a custom theme easily and download it

http://jgilfelt.github.io/android-actionbarstylegenerator/#name=tab%20style&compat=sherlock&theme=light&actionbarstyle=solid&texture=0&hairline=0&backColor=a6c%2C100&secondaryColor=D6D6D6%2C100&tabColor=33B5E5%2C100&tertiaryColor=F2F2F2%2C100&accentColor=33B5E5%2C100&cabBackColor=FFFFFF%2C100&cabHighlightColor=33B5E5%2C100

answered Jul 31 '13 at 13:36

keshav

3,235
1
16
22

There must be other way than just generating images, I just want to use XML without creating other files. – Damian Jul 31 '13 at 13:54
If you want to use different colors you can customize the code by replacing images with your colors – keshav Jul 31 '13 at 14:03
You mean without using images? Is it possible? – Damian Jul 31 '13 at 14:20

score 0 · Answer 3 · answered Aug 01 '13 at 05:39

In your theme add this

<item name="TabPageStyle">@style/CustomTabPage</item>

and in your style add this ,the footer color is your tab under color

<style name="CustomTitlePage">
    <item name="android:background">#18FF0000</item>
    <item name="footerColor">#00FFCC</item>
    <item name="footerLineHeight">1dp</item>
    <item name="footerIndicatorHeight">3dp</item>
    <item name="footerIndicatorStyle">underline</item>
    <item name="android:textColor">#00FF04</item>


</style>

How to change ActionBar Tab bottom border and selected tab background?

3 Answers3