How to change the overflow icon of the contextual action bar without changing it for the standard action bar?
Asked Answered
T

1

8

My app's theme looks like shown in the following screenshot:

action bar with white overflow icon

As the theme is based on Theme.Holo.Light which contains dark action bar texts and overflow icon, I adjusted the overflow icon using the following style:

<style name="ActionBar.Light" parent="android:style/Widget.Holo.ActionBar">
  <item name="android:background">@color/highlight</item>
  <item name="android:titleTextStyle">@style/TextAppearance.ActionBar.Title.Light</item>
  <item name="android:subtitleTextStyle">@style/TextAppearance.ActionBar.Subtitle.Light</item>
</style>
...
<style name="Theme.Light" parent="@android:style/Theme.Holo.Light">
  ...
  <item name="android:actionBarStyle">@style/ActionBar.Light</item>
  <item name="android:actionOverflowButtonStyle">@android:style/Widget.Holo.ActionButton.Overflow</item>
  ...
</style>

When one or more list entries are checked I want to show a white contextual action bar, but unfortunately the white overflow icon isn't visible on the white background:

contextual action bar with white overflow icon on white background

Any idea on how to change the overflow icon only for the contextual bar -- either via style or programatically?

Final Workaround (February 27 2014)

It seems as there isn't an option to change the overflow icon of the contextual action bar independent from the one of the standard action bar. So I had no other choice but changing the background color of the contextual bar to a dark gray, to make the white overflow button visible:

gray contextual action bar

The icons on the right are under my control, so it was easy to change them. The "done" icon on the left and the text (check counter) can easily be changed using theme attributes. Only the thin separator between the "done" icon and the check counter cannot be changed using attributes. They would require a custom layout -- that's why I left it how it is for now.

Here's my contextual bar style and the relevant part from the theme:

<style name="TextAppearance.ActionBar.Title" parent="@android:style/TextAppearance.Holo.Widget.ActionBar.Title">
    <item name="android:fontFamily">sans-serif-light</item>
</style>
<style name="TextAppearance.ActionBar.Title.Light">
    <item name="android:textColor">#ffffff</item>
</style>

<style name="ContextualBar.Light" parent="android:style/Widget.Holo.ActionMode">
    <item name="android:background">#666666</item>
    <item name="android:titleTextStyle">@style/TextAppearance.ActionBar.Title.Light</item>
    <item name="android:actionMenuTextColor">#ffffff</item>
</style>

<style name="Theme.Light" parent="@android:style/Theme.Holo.Light">
    ...
    <item name="android:actionBarStyle">@style/ActionBar.Light</item>
    <item name="android:actionModeStyle">@style/ContextualBar.Light</item>
    <item name="android:actionModeCloseDrawable">@drawable/ic_action_done</item>
    <item name="android:actionOverflowButtonStyle">@android:style/Widget.Holo.ActionButton.Overflow</item>
    <item name="android:actionMenuTextColor">#ffffff</item>
    ...
</style>

Ads: You can see the full result in the final app "uPod" which is available at Google play!

Too answered 22/10, 2013 at 15:25 Comment(6)
Might be easier to just change the contextual action bar background color to some light blue.Utile
hey , did you figure this out? i've hit the same problemKendra
@alexsummers Seems there simply isn't away to have different overflow icons for standard and contextual action bar. I've changed my contextual bar's background to be dark gray, so that the white icons becomes visible.Too
@Too ooh. But the 'X' mark and the other icon, appear to be in grey in the 2nd image and white in the first right?Kendra
@alexsummers Right. I've edited my question and added a workaround section at the bottom which describes my workaround.Too
cool.. checked out the app too, looks great. congrats. :)Kendra
A
3

On your theme and assuming your using Appcompat

<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
   <item name="android:actionOverflowButtonStyle">@style/OverFlowStyle</item>
</style>
<style name="OverFlowStyle"  parent="Widget.AppCompat.ActionButton.Overflow">
   <item name="android:src">@drawable/your_selector_drawable_here</item>  
</style>
Amends answered 10/2, 2014 at 15:38 Comment(1)
I am using the native action bar. And as far as I can see your style will change the icon for both: normal mode and contextual mode. I want to have different icons for normal and contextual mode.Too

© 2022 - 2024 — McMap. All rights reserved.