Change ActionBar Menu Icons depending on Style

Question

I want to use different ActionBar Icons depending on which style I use (Dark or Light). I couldn't figure it out how, heres what I tried:

<style name="AppThemeDark" parent="Theme.Sherlock.ForceOverflow">
    <item name="android:actionButtonStyle">@style/customActionButtonStyleDark</item>
    <item name="actionButtonStyle">@style/customActionButtonStyleDark</item>
</style>

<style name="AppThemeLight" parent="Theme.Sherlock.Light.ForceOverflow">
    <item name="android:actionButtonStyle">@style/customActionButtonStyleLight</item>
    <item name="actionButtonStyle">@style/customActionButtonStyleLight</item>
</style>

<style name="customActionButtonStyleDark" >
    <item name="@drawable/action_search">@drawable/action_search</item>
</style>

<style name="customActionButtonStyleLight" >
    <item name="@drawable/action_search">@drawable/action_search_light</item>
</style>

I also tried to insert <item name="@drawable/action_search">@drawable/action_search</item> directly into the theme style, but nothing worked.
Any ideas how?

Answer 1

Even though you found a workaround, maybe this will help someone else. I found a simple way to do this in xml (what logcat's answer is referring to). The trick I used was to create custom attributes for my menu/actionbar icons. You have to have one attribute per menu item icon.

You need to create attrs.xml in your values folder, and add your custom attributes. Think of each attribute as a constant that your themes/styles set, and then your styles/views can use those contants to set properties.

<declare-styleable name="customAttrs">
    <attr name="customSearchIcon" format="reference" />
</declare-styleable>

In your styles.xml in your values folder, have your themes/styles that set your custom icon attributes to drawable references.

<style name="AppThemeDark" parent="Theme.Sherlock.ForceOverflow">
    <item name="customSearchIcon">@drawable/action_search</item>
</style>

<style name="AppThemeLight" parent="Theme.Sherlock.Light.ForceOverflow">
    <item name="customSearchIcon">@drawable/action_search_light</item>
</style>

Lastly, in your [menu_name].xml in your menu folder, have your menu item set its icon to your matching custom icon attribute.

<item
    android:id="@+id/menuitem_search" 
    android:icon="?attr/customSearchIcon"/>

Now, depending on what theme is set, the icon for the menu item will change. Also, this allows you to still have API specific versions of your drawables (light and dark) using resource identifiers with your drawable folders, so you can have different menu style icons for pre 3.0 and actionbar style icons for 3.0+.

Also, remember when setting a theme at runtime (vs AndroidManifest.xml), you must set it before calling setContentView() in your Activity. It is recommended to restart your activity after changing the theme of an Activity that has already been created.

Answer 2

I think you did not get theming :) When you are trying to do:

<style name="customActionButtonStyleDark" >
    <item name="@drawable/action_search">@drawable/action_search</item>
</style>

You are trying to overload some attribute in theme with name "@drawable/action_search"

I have bad news for you, I think there is no such. So you can go to the theme Theme.Sherlock.ForceOverflow and it's parents and see what you can overload.

If nothing help's you, and you want to have custom attribute in your theme for different icons, It's different topic. You need to create attribute in attrs.xml, point your icon source to this new attribute and define attribute value in theme. For every different button.

Answer 3

Solved it, but gave it up to try it with XML, I did it now programmatically:

@Override
    public boolean onCreateOptionsMenu(Menu menu) {
        SharedPreferences prefs = getSharedPreferences("app", 0);
        boolean isDark = "Dark".equals(prefs.getString("theme", "Dark"));

        com.actionbarsherlock.view.MenuInflater inflater = getSupportMenuInflater();
        inflater.inflate(R.menu.main, menu);

        // set Icons
        menu.findItem(R.id.menuitem_search).setIcon(isDark ? R.drawable.action_search : R.drawable.action_search_light);
        menu.findItem(R.id.menuitem_add).setIcon(isDark ? R.drawable.content_new : R.drawable.content_new_light);
        menu.findItem(R.id.menuitem_share).setIcon(isDark ? R.drawable.social_share : R.drawable.social_share_light);
        return true;
    }