Android – Styling ActionBar dropdown menu

androidandroid-theme

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.

Best Answer

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

Related Topic