Search code examples
androidandroid-actionbarandroid-stylesandroid-actionbar-compat

actionbar style not override the style of action bar tabs


I use the code below to change the style of a tabbed activity in my application:

<resources xmlns:android="http://schemas.android.com/apk/res/android">

<!--
    Base application theme, dependent on API level. This theme is replaced
    by AppBaseTheme from res/values-vXX/styles.xml on newer devices.



-->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
    <!--
        Theme customizations available in newer API levels can go in
        res/values-vXX/styles.xml, while customizations related to
        backward-compatibility can go here.



    -->

</style>

<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">

    <!-- All customizations that are NOT specific to a particular API-level can go here. -->

    <item name="actionBarStyle">@style/ActionBarTheme</item>
</style>

<!-- Action Bar them -->

<style name="ActionBarTheme" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
    <item name="background">@drawable/ab_solid_appolo</item>
    <item name="backgroundSplit">@drawable/ab_bottom_solid_appolo</item>
    <item name="titleTextStyle">@style/ActionBarText</item>
    <item name="icon">@drawable/ic_action_launcher</item>
    <item name="actionBarTabStyle">@style/ActionBarTabStyle.Appolo</item>
</style>

<style name="ActionBarText" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
    <item name="android:textColor">#000000</item>
</style>

<!-- ActionBar tabs styles -->
<style name="ActionBarTabStyle.Appolo" parent="@style/Widget.AppCompat.Light.ActionBar.TabView">
    <item name="background">@drawable/actionbar_tab_indicator</item>
</style>

This is the actionbar_tab_indicator content:

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

 <!-- Non focused states -->
    <item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@android:color/transparent" />
    <item android:state_focused="false" android:state_selected="true"  android:state_pressed="false" android:drawable="@drawable/tab_selected" />

    <!-- Focused states -->
    <item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/tab_unselected_focused" />
    <item android:state_focused="true" android:state_selected="true"  android:state_pressed="false" android:drawable="@drawable/tab_selected_focused" />

    <!-- Pressed -->
    <!--    Non focused states -->
    <item android:state_focused="false" android:state_selected="false" android:state_pressed="true" android:drawable="@drawable/tab_unselected_pressed" />
    <item android:state_focused="false" android:state_selected="true"  android:state_pressed="true" android:drawable="@drawable/tab_selected_pressed" />

    <!--    Focused states -->
    <item android:state_focused="true" android:state_selected="false" android:state_pressed="true" android:drawable="@drawable/tab_unselected_pressed" />
    <item android:state_focused="true" android:state_selected="true"  android:state_pressed="true" android:drawable="@drawable/tab_selected_pressed" />
</selector>

I also use the code below for styles in style-v11 and style-v14:

...
      <style name="ActionBarTheme" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
        <item name="background">@drawable/ab_solid_appolo</item>
        <item name="backgroundSplit">@drawable/ab_bottom_solid_appolo</item>
        <item name="android:titleTextStyle">@style/ActionBarText</item>
        <item name="android:icon">@drawable/ic_action_launcher</item>
        <item name="android:actionBarTabStyle">@style/ActionBarTabStyle.Appolo</item>
    </style>

    <style name="ActionBarText" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
        <item name="android:textColor">#000000</item>
    </style>

   <!-- ActionBar tabs styles -->
    <style name="ActionBarTabStyle.Appolo" parent="@style/Widget.AppCompat.Light.ActionBar.TabView">


        <item name="android:background">@drawable/actionbar_tab_indicator</item>
    </style>
...

But it is not changing the style of the tab bar.

I checked my code many times, I searched and reviewed all my notes but I can't find what the problem is. Does anyone have any answers?


Solution

  • The problem was in this part of code:

    <style name="ActionBarTheme" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
    <item name="background">@drawable/ab_solid_appolo</item>
    <item name="backgroundSplit">@drawable/ab_bottom_solid_appolo</item>
    <item name="titleTextStyle">@style/ActionBarText</item>
    <item name="icon">@drawable/ic_action_launcher</item>
    <item name="actionBarTabStyle">@style/ActionBarTabStyle.Appolo</item>
    

    and especially this line:

    <item name="actionBarTabStyle">@style/ActionBarTabStyle.Appolo</item>
    

    this line should not be in the custom them that I want to use as my action bar theme. The right way is adding this under my custom app them so I remove this line from above part and add it under AppBaseTheme:

    <style name="AppTheme" parent="AppBaseTheme">
    
        <!-- All customizations that are NOT specific to a particular API-level can go here. -->
    
        <item name="actionBarStyle">@style/ActionBarTheme</item>
         <item name="actionBarTabStyle">@style/ActionBarTabStyle.Appolo</item>
    </style>
    

    and now the code is working right.