Leandros
Leandros

Reputation: 16825

Change ActionBar Menu Icons depending on Style

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?

Upvotes: 6

Views: 3783

Answers (4)

Joe Bowbeer
Joe Bowbeer

Reputation: 3841

See res/xml/ic_search.xml in blog post AppCompat — Age of the vectors (Chris Barnes)

Notice the reference to ?attr/colorControlNormal

<vector xmlns:android="..."
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="24.0"
    android:viewportHeight="24.0"
    android:tint="?attr/colorControlNormal">
    <path
        android:pathData="..."
        android:fillColor="@android:color/white"/>
</vector>

Upvotes: 0

Steven Byle
Steven Byle

Reputation: 13269

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.

Upvotes: 19

Leandros
Leandros

Reputation: 16825

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;
    }

Upvotes: 1

logcat
logcat

Reputation: 3454

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.

Upvotes: 2

Related Questions