Aditi K
Aditi K

Reputation: 1554

How to change selected tab Color or Font color for ActionbarTab?

I am using xml to change background of selected tab using Actionbar Tab with view pager code is below,

style.xml

<!-- Custom theme. -->
<style name="MyTheme" parent="android:style/Theme.Holo.Light">
    <item name="android:windowActionBar">true</item>
    <item name="android:actionBarSize">30dp</item>
    <item name="android:icon">@drawable/logo</item>
    <item name="android:actionBarTabTextStyle">@style/Widget.Holo.TabWidget</item>
     <!-- <item name="android:actionBarTabTextStyle">@style/customTabBar</item>   -->

</style>
<style name="Widget.Holo.TabWidget" parent="android:style/Widget.TabWidget">
    <item name="android:tabStripLeft">@null</item>
    <item name="android:tabStripRight">@null</item>
    <item name="android:tabStripEnabled">true</item>
    <!-- <item name="android:divider">@android:attr/dividerVertical</item> -->
    <item name="android:showDividers">middle</item>
    <item name="android:dividerPadding">8dip</item>
     <item name="android:divider">@android:attr/dividerVertical</item>
     <item name="android:dividerHeight">10dp</item>
    <item name="android:measureWithLargestChild">true</item>        
    <item name="android:textSize">16sp</item>
    <item name="android:textStyle">bold</item>  
    <item name="android:background">@drawable/tab_bg_selector</item>

</style>

tab_bg_selector.xml

<?xml version="1.0" encoding="utf-8"?>

<!-- Active tab -->

<item android:drawable="@drawable/tab_bg_selected" android:state_focused="false" android:state_pressed="false" android:state_selected="true"/>

<!-- Inactive tab 

<item android:drawable="@drawable/tab_bg_unselected" android:state_focused="false" android:state_pressed="false" android:state_selected="false"/>

-->

<item android:drawable="@android:color/transparent" android:state_pressed="true"/>

<!-- Selected tab (using d-pad) -->

<item android:drawable="@android:color/transparent" android:state_focused="true" android:state_pressed="false" android:state_selected="true"/>

tab_bg_selected.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >

<gradient
    android:centerColor="#7F7F7F"
    android:endColor="#696969"
    android:startColor="#A8A8A8" />

 </shape>

It shows me changed color but color is changes for text background only I want to change for whole Tab selected

See below image,

enter image description here

Upvotes: 3

Views: 2024

Answers (2)

alin0509
alin0509

Reputation: 551

Take a look to this: Styling Tabs

Upvotes: 0

Menna-Allah Sami
Menna-Allah Sami

Reputation: 580

These custom styles work fine for me

 <style name="MyActionBarTabStyle" parent="@style/Widget.AppCompat.Light.ActionBar.TabView">
    <item name="android:tabStripEnabled">false</item>
    <item name="android:footerDividersEnabled">false</item>
    <item name="android:background">@drawable/tab_selector</item>
    <item name="background">@drawable/tab_selector</item>
</style>

And

<style name="MyActionBarTabTextStyle" parent="@style/Widget.AppCompat.Light.ActionBar.TabText">
    <item name="android:textColor">@color/tab_text_color</item>
    <item name="android:textSize">12sp</item>
    <item name="android:gravity">fill_horizontal</item>
</style>

I hope it works fine for u as well

Upvotes: 2

Related Questions