Question

I am changing the Android ActionBar color by creating my own style and applying through the manifest. but when I am running on the Emulator, the ActionBar as well as the screen itself is changing the color. See the image:

enter image description here

I tried to search answer for this problem but got no solution. Here is the Manifest:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.actionbartestapp"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="11"
        android:targetSdkVersion="18" />

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/MyActionBar" >
        <activity
            android:name="com.example.actionbartestapp.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>

</manifest>

And here is the Styles.xml file:

<resources>

    <!--
        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="android:Theme.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. -->
    </style>

    <style name="MyActionBar" parent="@android:style/Widget.Holo.Light.ActionBar">
        <item name="android:background">@color/SmugeBlue</item>
    </style>

</resources>
Was it helpful?

Solution

In your code you have

  parent="android:Theme.Light

Notice the change in my code

  parent="@android:style/Theme.Holo.Light"

Also notice <item name="android:actionBarStyle"

  <item name="android:actionBarStyle">@style/MyActionBar</item> // for action bar only

Instead you had

  <item name="android:background">@color/SmugeBlue</item> // so it changes background for entire screen

Have the below in respective res/values/styles.xml

  <style name="MyTheme" parent="@android:style/Theme.Holo.Light">
     <item name="android:actionBarStyle">@style/MyActionBar</item>

  </style>

  <style name="MyActionBar" parent="@android:style/Widget.Holo.Light.ActionBar">
     <item name="android:background">#FF9D21</item> // change to blue color
  </style> 

and in manifest

   android:theme="@style/MyTheme"

You can see a example with snapshot although the question answered about overflow menu icon it does show that the actionbar color is changed

Change action bar overflow icon

For further styling

https://developer.android.com/training/basics/actionbar/styling.html

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top