There are a million questions and articles out there about Android themes and styles - I've read half of them and I'm still going crazy.
All I want - and coming from a background in web app development with lovely, friendly old CSS stylesheets I thought this would be easy - is to create a theme for my app, and specify in that theme the colour for my toolbars (I'm specifying them per-Activity, which I think is the right thing to do after reading the official documentation).
So, in my styles.xml file I've got:
<style name="MyTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:toolbarStyle">#style/MyToolbar</item>
</style>
<style name="MyToolbar" parent="Base.Widget.AppCompat.Toolbar">
<item name="android:textColor">#ffffff</item>
<item name="android:textColorPrimary">#ffffff</item>
<item name="android:elevation">4dp</item>
<item name="android:background">#color/colorPrimary</item>
</style>
To my mind, I have here created a style for my toolbars, then referenced that style in my theme. I have then set my theme as the application theme in AndroidManifest.xml:
android:theme="#style/MyTheme"
And for the most part, that works. There are other styles referenced in my theme, which I've omitted from my code for the sake of simplicity, and they work correctly - my buttons, textviews and so on are styled as per the styles I've created.
But the pesky toolbars are not. I've tried referecing my style directly in the toolbar xml (even though I don't see why I should need to if it's specified in the theme):
<android.support.v7.widget.Toolbar
android:id="#+id/main_activity_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
style="#style/MyToolbar">
</android.support.v7.widget.Toolbar>
This, frustratingly, does cause the background colour of the toolbar to be as I want it, but the text remains black, even though I'm trying to make it white.
Have I misunderstood the way themes reference styles and are then applied to activities or the whole application? Is there something unique about toolbars? It's taken me longer to try and figure this out than to write the whole rest of the app from scratch, and it's my first Android app!
UPDATE:
Ok, so I've worked out that whilst my toolbar's background colour needs to be set in a style applied to the toolbar, to prevent that background colour being propogated to all child views, the desired text colour needs to specified in a theme because the text displayed in the toolbar is a child view (even though I can't see it in my activity's xml). So, this works:
styles.xml:
<style name="MyTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:buttonStyle">#style/MyButton</item>
<item name="android:editTextStyle">#style/MyEditText</item>
</style>
<style name="MyToolbarStyle" parent="Base.Widget.AppCompat.Toolbar">
<item name="android:elevation">4dp</item>
<item name="android:background">#color/colorPrimary</item>
</style>
<style name="MyToolbarTheme" parent="Base.Widget.AppCompat.Toolbar">
<item name="android:textColorPrimary">#ffffff</item>
</style>
main_activity.xml:
<android.support.v7.widget.Toolbar
android:id="#+id/main_activity_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
style="#style/MyToolbarStyle"
app:theme="#style/MyToolbarTheme">
</android.support.v7.widget.Toolbar>
So I guess I've achieved what I wanted, but I haven't answered my original question: why isn't the toolbar styling applied implicitly from my theme? Why do I have to declare it explicitly in the markup for my toolbar?
Do something like this:
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/main_activity_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:theme="#style/MyToolbar"
app:popupTheme="#style/TextStyle"/>
Additionally, read this information here to get an idea about style and theme. Refer this link here.
For me:
<item name="toolbarStyle">#style/MyToolbar</item>
instead of:
<item name="android:toolbarStyle">#style/MyToolbar</item>
works great.
Related
For some reason in my application, when using "Theme.AppCompat" as my style, it makes my Menus black text (which I set since I want black text) on a dark grey background, as shown here:
I have tried manually setting the menu's background color using a few online resources but none seem to be working. Does anyone know what might be causing the issue? Below is my style.xml, and as you can see, the two bottom elements in the main app theme entry are me trying to change the background color using things I've found online.
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat">
<item name="windowActionBar">false</item>
<item name="android:windowBackground">#color/white_primary</item>
<item name="android:textColor">#color/text_primary</item>
<item name="android:textSize">#dimen/text_size_medium</item>
<item name="colorAccent">#color/black_primary</item>
<item name="android:popupMenuStyle">#style/PopupMenuStyle</item>
<item name="android:panelFullBackground">#drawable/menu_full_bg</item>
</style>
<style name="PopupMenuStyle" parent="Theme.AppCompat.Light">
<item name="android:popupBackground">#android:color/white</item>
</style>
<drawable name="menu_full_bg">#FFFFFF</drawable>
You can change the background color of the popup menu as below.
Create a style in your styles.xml
<style name="PopupMenuStyle" parent="Theme.AppCompat.Light">
<item name="android:background">#android:color/white</item>
</style>
Set this theme as your toolbar popup theme in your toolbar.xml
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
// Your code here
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/PopupMenuStyle" />
Hope this helps.
You can just use appNS to define the popupTheme as shown below.
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
What I did was I change my popUpTheme to DayNight so use
app:popupTheme="#style/ThemeOverlay.AppCompat.DayNight">
Refer this link
The accepted answer here worked for me. I am just repeating the same answer here again.
Add the following to your Toolbar xml
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#color/toolbarbackground"
android:elevation="4dp"
app:popupTheme="#style/YOUR_THEME_HERE"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
In your styles.xml:
<style name="YOUR_THEME_HERE" parent="ThemeOverlay.AppCompat.Light">
<item name="android:colorBackground">#000000</item>
<item name="android:textColor">#ffffff</item>
</style>
The above style gives white font on a black background.
Credit to #Eugen Pechanec
I discourage this line:
<item name="android:background">#android:color/white</item>
as on my device the menu popup animation behaved rather ugly. Instead it was sufficient to just use this:
<style name="PopupMenuStyle" parent="Theme.AppCompat.Light">
</style>
I tried to add this into Toolbar:
app:popupTheme="#style/Theme.AppCompat.Light"
BUT at the Night mode the background will be white, and the text white too.
(this will helpful in only Day mode, or your app does not follow Day/Night switch)
Another tried, I add this style for menu popup, as Pojaa said above:
<style name="PopupMenuStyle" parent="Theme.AppCompat.Light">
<item name="android:background">#android:color/white</item>
</style>
BUT this create an effect: when you click the menu, it show the white background of popup menu first (the white background), and then show up the items, this very not good for user experience. Maybe Android change by time, the experience will different!
You SHOULD just try this for your wish:
app:popupTheme="#style/Theme.AppCompat.DayNight"
This is late answer, but hope it will help someone else!
Not sure if this's help. It may be a simpler solution. Within AppCompat - themes_base.xml you will find the section below.
<!-- Panel attributes -->
<item name="panelMenuListWidth">#dimen/abc_panel_menu_list_width</item>
<item name="panelMenuListTheme">#style/Theme.AppCompat.CompactMenu</item>
<item name="panelBackground">#drawable/abc_menu_hardkey_panel_mtrl_mult</item>
<item name="android:panelBackground">#android:color/transparent</item>
<item name="listChoiceBackgroundIndicator">#drawable/abc_list_selector_holo_dark</item>
Create a theme within your app and apply the colour.
<style name="Theme.Base" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<item name="android:panelBackground">#android:color/black</item>
</style>
I know there are a couple of questions about styling the contextual action bar (ActionMode) piece of the action bar, but they don't quite seem to address what I'm after.
I'm using the Toolbar with a light theme and dark action bar. The Toolbar looks like I want it, but the action mode looks like the regular dark theme. What do I need to change in my style to get the dark themed action mode (not just action bar)? It seems I should be able to do this quickly by tapping into Theme.AppCompat since that shows the CAB how I want it, but I don't want the rest of the application to be dark.
I'm only concerned about API 14+ and am using the support Toolbar in place of action bar.
Here is my base style
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="android:actionModeBackground">#color/colorActionMode</item>
<item name="android:windowActionModeOverlay">true</item>
</style>
Toolbar style
<style name="AppTheme.Toolbar" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:textColorPrimary">#color/abc_primary_text_material_dark</item>
<item name="actionMenuTextColor">#color/abc_primary_text_material_dark</item>
<item name="android:textColorSecondary">#color/abc_primary_text_material_dark</item>
<item name="android:background">#color/colorPrimaryDark</item>
</style>
Toolbar layout file (setting popupTheme here doesn't seem to have any effect).
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
app:theme="#style/AppTheme.Toolbar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Dark"
android:popupTheme="#style/ThemeOverlay.AppCompat.Dark"
android:elevation="2dp"
android:focusable="false"/>
Here's my Toolbar (which is how I want it)
Here's my ActionMode (which I need to invert)
Here's what I want the ActionMode to look like (which I got by changing my style to inherit from Theme.AppCompat instead of Theme.AppCompat.Light.DarkActionBar. The problem being that the rest of the application goes dark, which I don't want.
Start with overriding attribute actionModeStyle in your base theme:
<item name="actionModeStyle">#style/LStyled.ActionMode</item>
Define LStyled.ActionMode as:
<style name="LStyled.ActionMode" parent="#style/Widget.AppCompat.ActionMode">
<item name="titleTextStyle">#style/LStyled.ActionMode.Title</item>
<item name="subtitleTextStyle">#style/LStyled.ActionMode.Subtitle</item>
</style>
Finally:
<style name="LStyled.ActionMode.Title" parent="#style/TextAppearance.AppCompat.Widget.ActionMode.Title">
<item name="android:textColor">#color/color_action_mode_text</item>
</style>
<style name="LStyled.ActionMode.Subtitle" parent="#style/TextAppearance.AppCompat.Widget.ActionMode.Subtitle">
<item name="android:textColor">#color/color_action_mode_text</item>
</style>
This will override theme specified text color(s) for title & subtitle(if needed).
What's left is the overflow button. Fire up any image editing software that supports color-replacement. Use the overflow menu png from AppCompat's res/drawable-XXXX folder. Paint it white. Next, override actionOverflowButtonStyle in your base theme and specify the png you've just modified:
<item name="actionOverflowButtonStyle">#style/LStyled.OverFlow</item>
<style name="LStyled.OverFlow" parent="#style/Widget.AppCompat.ActionButton.Overflow">
<item name="android:src">#drawable/modified_overflow_icon</item>
</style>
There's not much of an explanation/tutorial that I can provide regarding customization of themes. The only way to get a hang of it is to go through [styles][themes].xml files from the framework. Reading the source code also helps - you'll get to know what attributes are being used and where/if they can be customized.
Point of mention:
I want to be able to extend a style to get the same behavior that's
built into the dark theme.
Yes, but this might not be desired. The part above that deals with modifying overflow menu icon can be substituted with an overridden colorControlNormal attribute. TintManager (Link) uses the color value from colorControlNormal to tint the overflow menu drawable (among other drawables). Take a look at the contents of array TINT_COLOR_CONTROL_NORMAL in the source code. But overriding colorControlNormal to fix one drawable may change the overall look & feel of the app for worse.
Check out this blog post which explains how to style the Toolbar to be dark:
http://android-developers.blogspot.ie/2014/10/appcompat-v21-material-design-for-pre.html
<android.support.v7.widget.Toolbar
android:layout_height=”wrap_content”
android:layout_width=”match_parent”
android:minHeight=”#dimen/triple_height_toolbar”
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
You specify a Toolbar "style". What I think you're missing is the app namespaced "theme" property which applies the style to the Toolbar and all of its children.
Edit: This should work for your specific case
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="android:actionModeBackground">#color/colorActionMode</item>
<item name="android:windowActionModeOverlay">true</item>
<item name="android:windowNoTitle">true</item>
<item name="windowActionBar">false</item>
</style>
<style name="AppTheme.Toolbar" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:textColorPrimary">#color/abc_primary_text_material_dark</item>
<item name="actionMenuTextColor">#color/abc_primary_text_material_dark</item>
<item name="android:textColorSecondary">#color/abc_primary_text_material_dark</item>
<item name="android:background">#color/colorPrimaryDark</item>
</style>
I just want to add to Vikram's answer, specific to coloring the overflow button and other default controls in the action mode.
The 'colorControlNormal' item that defines the coloring of these buttons in the action mode has to be placed in the action bar theme, not the action mode style. Only then will it be used for overflows, done, close and back buttons within the action mode.
Try to use
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
instead.
I try to style my v7.widget.Toolbar's menu radio buttons to use a custom drawable.
This works
<style name="AppBaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:listChoiceIndicatorSingle">#drawable/my_drawable</item>
</style>
But I guess this will change all of my apps radio buttons while I'd like to limit it to Toolbar only, so I am extracting to a custom theme and arrive to this:
<style name="AppBaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:actionBarWidgetTheme">#style/MyAbTheme</item>
</style>
<style name="MyAbTheme" parent="Theme.AppCompat.Dark">
<item name="android:listChoiceIndicatorSingle">#drawable/my_drawable</item>
</style>
Now, the above doesn't work - I have material-ish radio buttons which are default.
I also tried to do this:
<android.support.v7.widget.Toolbar
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:background="#color/primary"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/MyAbTheme"
/>
(+ in styles.xml change parent to overlay like this)
<style name="MyAbTheme" parent="ThemeOverlay.AppCompat.Dark">
<item name="android:listChoiceIndicatorSingle">#drawable/my_drawable</item>
</style>
but this doesn't do anything too.
Any hints of how I would style only radio buttons in a Toolbar?
Regards the second attempt:
AppCompat does not have the Theme.AppCompat.Dark, or am I wrong?
can be related to property's value null <item name="actionBarWidgetTheme">#null</item> in values/theme_base.xml of AppCompat, but i cannot explain because. Maybe this property is not longer used.
have you tried with and without android: prefix?
I'm making my app ready for Android 5.0, I'm using the latest compatibility library, here is what my style looks like.
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/theme_accent</item>
<item name="colorAccent">#color/theme_accent_secondary</item>
</style>
<style name="AppThemeDark" parent="Theme.AppCompat">
<item name="colorPrimary">#color/theme_accent</item>
<item name="colorAccent">#color/theme_accent_secondary</item>
</style>
</resources>
(The ActionBar color is being set programmatically.)
Now, I want the overflow/popup menu to have the dark background like it had in the holo implementation, but I can't get it to work, here is what it looks like:
I have tried setting the popupMenuStyle but it didn't work.
How can I make the popup menu darker?
Stop using the ActionBar. If you want a ToolBar to be set up like an ActionBar, follow this guide on the android-developers blog.
It actually mentions your use case at Dark Action Bar and provides this code:
<android.support.v7.widget.Toolbar
android:layout_height=”wrap_content”
android:layout_width=”match_parent”
android:minHeight=”#dimen/triple_height_toolbar”
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
Not a full answer but what I found so far:
In past versions you needed to specify a drawable (Check https://github.com/StylingAndroid/StylingActionBar code and tutorials)
Apparently, now that is a color. To modify it you need to do specify the following theme:
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="AppTheme" parent="android:Theme.Material.Light.DarkActionBar">
<item name="android:actionBarPopupTheme">#style/popupNew</item>
</style>
<style name="popupNew" parent="android:ThemeOverlay.Material.Light">
<item name="android:colorBackground">#color/red</item>
</style>
</resources>
This works correctly if the theme applied to the app is just this.
If I add android:actionBarPopupTheme to my existing theme, it doesn't work. I am trying to figure out why.
Solved my problem by using this style:
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/theme_accent</item>
<item name="colorAccent">#color/theme_accent_secondary</item>
<item name="actionBarStyle">#style/AbStyle</item>
<item name="actionModeBackground">#color/actionmode_bg</item>
</style>
<style name="AbStyle" parent="Widget.AppCompat.Toolbar">
<item name="elevation">2dp</item>
<item name="displayOptions">homeAsUp|showTitle</item>
<!--showHome-->
</style>
<style name="AppThemeDark" parent="Theme.AppCompat">
<item name="colorAccent">#color/theme_accent_secondary</item>
<item name="actionBarStyle">#style/AbStyle</item>
</style>
I had to use Widget.AppCompat.Toolbar as the parent actionBarStyle
Add the property popupTheme to your toolbar:
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/color_primary"
app:theme="#style/Theme.AppCompat.Light"
app:popupTheme="#style/Theme.AppCompat" />
Or define a new style for your toolbar:
<style name="MyToolBarStyle" parent="Widget.AppCompat.Toolbar">
<item name="android:background">#color/green</item>
<item name="popupTheme">#style/Theme.AppCompat.Light</item>
<item name="theme">#style/Theme.AppCompat</item>
</style>
This question has already been answered for styling via XML, but I'm adding an explanation here of how to work out the solution to this and similar styling questions yourself.
First, this is the solution when using AppCompat. To your App's style.xml add actionBarPopupTheme to your theme:
<style name="Theme.MyTheme" parent="#style/Base.Theme.AppCompat.Light.DarkActionBar">
...other stuff here
<item name="actionBarPopupTheme">#style/Theme.MyTheme.ActionBarPopupTheme</item>
</style>
<style name="Theme.MyTheme.ActionBarPopupTheme" parent="#style/ThemeOverlay.AppCompat.Light">
<item name="android:textColor">#android:color/white</item>
<item name="android:background">#android:color/black</item>
</style>
Here's the steps I took to arrive at this solution (it takes a bit of detective work as the Android documentation is poor):
Open your App's style.xml in Android Studio
On the line where you App's theme is defined, put your screen cursor in the parent theme (e.g. click in #style/Base.Theme.AppCompat.Light.DarkActionBar) then press F4. This should take you to the source code for the style in the appcompat library.
Within this style I saw this line:
< item name="actionBarPopupTheme">#style/ThemeOverlay.AppCompat.Light< /item>
This looked like a possible place to change the theme of the popup. I searched for "actionBarPopupTheme" in the poor
Android developers documentation and found "Reference to a theme that should be used to
inflate popups shown by widgets in the action bar". So this was worth playing with.
I copied the appcompat line containing "actionBarPopupTheme" to my style.xml then in this line replaced the item's theme reference (the bit in bold above) with Theme.MyTheme.ActionBarPopupTheme.
In my style.xml I created my new style named Theme.MyTheme.ActionBarPopupTheme. I used the same parent that was used in the style I copied from the appcompat source (the bit in bold above).
To ensure my new popup style was working, I changed the parent style to ThemeOverlay.AppCompat.Dark then ran and tested the code on a device. The popup style changed, so now I knew my overriding of actionBarPopupTheme was the correct thing to do. Then I changed back to ThemeOverlay.AppCompat.Light.
The next challenge is to work out what item names to override in Theme.MyTheme.ActionBarPopupTheme. I changed the text and background colours. To find the correct item names that change the style of something can be tricky in some cases. One way to find less obvious style item names is to look through the style definitions in the appcompat xml file (the one you opened when pressing F4 in the 2nd step above), continually descending into parent styles (F4 again!) until you find something that may do what you want. Google searches will help here too.
I'm using a custom theme that inherits from DarkActionBar and I want to customize dropdown menu to be white like when using Light Holo theme.
I've been able to change the background to white using:
<style name="MyTheme" parent="#style/Theme.Light.DarkActionBar">
<item name="android:actionDropDownStyle">#style/MyDropDownNav</item>
</style>
<style name="MyDropDownNav">
<item name="android:background">#drawable/spinner_background_white</item>
<item name="android:popupBackground">#drawable/menu_dropdown_panel_whyite</item>
<item name="android:dropDownSelector">#drawable/selectable_background_white</item>
</style>
But I haven't any clue of how to change the text color to black. Because after setting white drawable the problem is that text isn't visible because is white on white background.
I answer myself after some investigation.
In addition to question's styling you need to:
Customize android:spinnerDropDownItemStyle for actionBarWidgetTheme changing it's text appearance.
Also don't forget that dropdown list is managed by the adapter you use. Then if you used the standard one (simple_dropdown_item_1line) there's no problem. But if you used a custom one like me (to be able to add an icon) don't forget to apply style="?attr/spinnerDropDownItemStyle" in your layout TextView.
Then final custom style is:
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="Theme.myapp" parent="#style/Theme.Light.DarkActionBar">
<item name="android:actionDropDownStyle">#style/myapp_DropDownNav</item>
<item name="android:actionBarWidgetTheme">#style/myapp.actionBarWidgetTheme</item>
</style>
<style name="myapp.actionBarWidgetTheme" parent="#style/Theme.">
<item name="android:spinnerDropDownItemStyle">#style/myapp.Widget.DropDownItem.Spinner</item>
</style>
<style name="myapp_DropDownNav" parent="#style/Widget.Spinner.DropDown.ActionBar">
<item name="background">#drawable/spinner_background_ab_myapp</item>
<item name="android:background">#drawable/spinner_background_ab_myapp</item>
<item name="android:popupBackground">#drawable/menu_dropdown_panel_myapp</item>
<item name="android:dropDownSelector">#drawable/selectable_background_myapp</item>
</style>
<style name="myapp.Widget.DropDownItem.Spinner" parent="Widget.DropDownItem.Spinner">
<item name="android:textAppearance">#style/myapp.TextAppearance.Widget.DropDownItem</item>
</style>
<style name="myapp.TextAppearance.Widget.DropDownItem" parent="TextAppearance.Widget.DropDownItem">
<item name="android:textColor">#color/black</item>
</style>
Where drawables in myapp_DropDownNav are white background ones that you can generate with ActionBar Style generator in Android Asset Studio
Try setting itemTextAppearance. That should achieve what you want.
I have stumbled on what may be the simplest way to do this. I was working with the AppCompat library.
<style name="ApplicationTheme" parent="#style/Theme.AppCompat">
<item name="android:actionBarWidgetTheme">#style/Theme.AppCompat.Light</item>
<item name="actionBarWidgetTheme">#style/Theme.AppCompat.Light</item>
</style>
My advice is to simply inherit from the Sherlock.Light theme and change the applicable fields to the Dark values. For my app, we wanted a white "up" icon, and white text for the action labels. I don't provide dark versions of my actionbar icons, so they are all white anyway. So after several hours messing around with it and following different people's suggestions, I finally found what I was looking for in the ABS themes file.
I inherit from Sherlock.Light (well, technically HoloEverywhereLight.Sherlock but...) and change:
<item name="android:actionMenuTextColor">#color/White</item>
<item name="actionMenuTextColor">#color/White</item>
<item name="android:homeAsUpIndicator">#drawable/abs__ic_ab_back_holo_dark</item>
<item name="homeAsUpIndicator">#drawable/abs__ic_ab_back_holo_dark</item>
<item name="android:dividerVertical">#drawable/abs__list_divider_holo_dark</item>
<item name="dividerVertical">#drawable/abs__list_divider_holo_dark</item>
That's it. It's way simpler and easier than trying to extend classes, restyle things in code, etc.