Android: Problems with ActionBar Customization

Question

I've just now started to learn Android Development on my own and I'm facing a problem and I need help.

I'm learning about ActionBar. I was interested to customize the ActionBar.

The steps I've followed to change its background color and the spacing of the items are:

1. The idea was to have a base theme with an ActionBar. Then customize it. The code:

   <!-- Base application theme. -->
   <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
       <!-- Customize your theme here. -->
       <item name="android:actionBarStyle">@style/MyActionBarTheme</item>
   </style>
   
   <style name="MyActionBarTheme" parent="@android:style/Widget.Holo.Light.ActionBar">
       <item name="android:background">#F44336</item>
   </style>
   

2. Next, in my AndroidManifest.xml I use the custom theme I've created. The code:

   <application
       android:allowBackup="true"
       android:icon="@mipmap/ic_launcher"
       android:label="@string/app_name"
       android:theme="@style/AppTheme" >
       <activity
           android:name=".MainActivity"
           android:label="@string/app_name" >
           <intent-filter>
               <action android:name="android.intent.action.MAIN" />
   
               <category android:name="android.intent.category.LAUNCHER" />
           </intent-filter>
       </activity>
   </application>
   

But the color of my ActionBar is still black. What am I doing wrong? Am I missing something?

Answer 1

You are using the appcompat-v7 action bar backport. To set the color of the action bar, use colorPrimary, not android:background, in your theme.

For example, this theme sets the three major color tints:

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <style name="Theme.Apptheme" parent="Theme.AppCompat">
    <item name="colorPrimary">@color/primary</item>
    <item name="colorPrimaryDark">@color/primary_dark</item>
    <item name="colorAccent">@color/accent</item>
  </style>
</resources>

This particular sample happens to define the color values themselves via color resources, in a res/values/colors.xml file:

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <color name="primary">#3f51b5</color>
  <color name="primary_dark">#1a237e</color>
  <color name="accent">#ffee58</color>
</resources>

An activity that uses the custom theme then gets the primary color as the action bar background:

(from this sample project)