HaggarTheHorrible
HaggarTheHorrible

Reputation: 7403

Android: Problems with ActionBar Customization

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?

enter image description here

Upvotes: 1

Views: 66

Answers (1)

CommonsWare
CommonsWare

Reputation: 1006614

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:

appcompat-v7 Sample

(from this sample project)

Upvotes: 3

Related Questions