Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Styling ActionBar dropdown menu

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.

like image 352
lujop Avatar asked Jul 13 '12 22:07

lujop


3 Answers

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

like image 89
lujop Avatar answered Oct 23 '22 03:10

lujop


Try setting itemTextAppearance. That should achieve what you want.

like image 37
Jason Robinson Avatar answered Oct 23 '22 04:10

Jason Robinson


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>
like image 28
Georgie Avatar answered Oct 23 '22 04:10

Georgie