Android ActionBar Background gets overridden by AppTheme Background

Question

I just can't figure this one out: I have an application with an ActionBar, I want the ActionBar to be red and the background of the app blue. I tried to achieve this with this styles.xml:

<style name="AppTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
    <item name="android:background">@color/blue</item>
    <item name="background">@color/blue</item>
    <item name="android:layout_marginTop">5dp</item>
    <item name="android:actionBarStyle">@style/MyActionBar</item>
    <item name="actionBarStyle">@style/MyActionBar</item>
</style>

<style name="MyActionBar" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
    <item name="android:background">@color/red</item>
    <item name="background">@color/red</item>
</style>

But the actionBar is always blue. When I take away the blue background of the app, the actionBar is red as desired...

Any ideas?

Answer 1

The margin that you set is ambiguous and does not apply to anything. You should set the margin on your action bar theme:

<style name="AppTheme" parent="Base.Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimary">@color/red</item>
    <item name="android:windowBackground">@color/blue</item>
    <item name="actionBarStyle">@style/MyActionBar</item>
</style>
<style name="MyActionBar" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
    <item name="android:layout_marginTop">5dp</item>
</style>

Answer 2

If all you're trying to do is a red action bar with a blue background, it is much easier to use the material properties included with v21+ of the support library:

<style name="AppTheme" parent="Base.Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimary">@color/red</item>
    <item name="android:windowBackground">@color/blue</item>
</style>