AppCompat 21: name = colorPrimary does not work with name = actionBarStyle

Question

When I use the actionBarStyle element, colorPrimary does not set the color to red. If I remove the actionBarStyle element, it will work. How can I change my code to display color?

<resources>

    <style name="AppTheme" parent="@style/Theme.AppCompat.Light">
        <item name="actionBarStyle">@style/MyStyledActionBar</item>
        <item name="colorPrimary">@color/red</item>
    </style>

    <style name="MyStyledActionBar" parent="@style/Widget.AppCompat.Light.ActionBar">
        <item name="titleTextStyle">@style/MyActionBarTitleText</item>
    </style>

    <style name="MyActionBarTitleText" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
        <item name="android:textColor">@color/white</item>
    </style>

</resources>

Answer 1

The root Widget.AppCompat.Light.ActionBaris the Base.Widget.AppCompat.ActionBarone that does not apply the background attribute.

<style name="Base.Widget.AppCompat.ActionBar" parent="">
    ...
    <item name="background">@null</item>
    <item name="backgroundStacked">@null</item>
    <item name="backgroundSplit">@null</item>
    ...
</style>

Instead, your parent should be Widget.AppCompat.Light.ActionBar.Solid, so that you inherit the attributes from Base.Widget.AppCompat.Light.ActionBar.Solidwhich the background attribute applies.

<style name="Base.Widget.AppCompat.Light.ActionBar.Solid">
    <item name="background">?attr/colorPrimary</item>
    <item name="backgroundStacked">?attr/colorPrimary</item>
    <item name="backgroundSplit">?attr/colorPrimary</item>
</style>

Alternatively, you can simply apply the background attribute yourself.

<style name="MyStyledActionBar" parent="@style/Widget.AppCompat.Light.ActionBar">
    <item name="titleTextStyle">@style/MyActionBarTitleText</item>
    <item name="background">?attr/colorPrimary</item>
</style>