How to change the background color of Action Bar s Option Menu in Android 4 2

Question

I d like to change the background color of the option  overflow  menu in Android 4 2  I have tried all the methods but it is still showing the default color set by the theme  I used the following code  amp  XML configs   MainActivity java  public class MainActivity extends Activity     SuppressLint  NewApi    Override protected void onCreate Bundle savedInstanceState        super onCreate savedInstanceState       setContentView R layout activity main        getActionBar   setIcon R drawable ic launcher            getActionBar   setTitle  Sample Menu        getActionBar   setBackgroundDrawable new                 ColorDrawable Color parseColor   33B5E5            int titleId   Resources getSystem   getIdentifier  action bar title    id    android        TextView titleText    TextView findViewById titleId       titleText setTextColor Color parseColor   ffffff          Override public boolean onCreateOptionsMenu Menu menu           Inflate the menu  this adds items to the action bar if it is present      getMenuInflater   inflate R menu main  menu       setMenuBackground        return true     protected void setMenuBackground                                Log d TAG   Enterting setMenuBackGround          getLayoutInflater   setFactory  new Factory                Override         public View onCreateView String name  Context context                  AttributeSet attrs                if   name equalsIgnoreCase   com android internal view menu IconMenuItemView                        try      Ask our inflater to create the view                       LayoutInflater f   getLayoutInflater                          final View view   f createView  name  null  attrs                             The background gets refreshed each time a new item is added the options menu                          So each time Android applies the default background we need to set our own                         background  This is done using a thread giving the background change as runnable                        object                        new Handler   post  new Runnable                               public void run                                       sets the background color                                view setBackgroundResource  R color menubg                                  sets the text color                                             TextView  view  setTextColor Color WHITE                                  sets the text size                                             TextView  view  setTextSize 18                                                            return view                        catch   InflateException e              catch   ClassNotFoundException e                           return null                      Menu xml   lt menu xmlns android  http   schemas android com apk res android   gt    lt item     android id    id action settings      android icon   drawable menu      android showAsAction  always      android title   string action settings  gt       lt menu gt           lt item             android id    id item1                           android showAsAction  always              android title   string item1    gt           lt item             android id    id item2                           android showAsAction  always              android title   string item2    gt           lt item             android id    id item3              android showAsAction  always              android title   string item3    gt           lt item             android id    id item4              android showAsAction  always              android title   string item4    gt       lt  menu gt   lt  item gt    lt  menu gt    color xml   lt color name  menubg  gt  33B5E5 lt  color gt    The above setMenuBackground is not taking any effect     In the above picture  I want to change the menu background from black to the blue color in the Action Bar  How can I achieve this  and what I did do wrong

User · Answer

In case you are working in the latest toolbar in android studio then here is the smallest solution To change the toolbar options menu color, add this to your toolbar element

 app:popupTheme="@style/MyDarkToolbarStyle"

Then in your styles.xml define the popup menu style

<style name="MyDarkToolbarStyle" parent="ThemeOverlay.AppCompat.Light"> <item name="android:colorBackground">@color/mtrl_white_100</item> <item name="android:textColor">@color/mtrl_light_blue_900</item> </style>

Note that you need to use colorBackground not background. The latter would be applied to everything (the menu itself and each menu item), the former applies only to the popup menu.

User · Answer

The Action Bar Style Generator  suggested by Sunny  is very useful  but it generates a lot of files  most of which are irrelevant if you only want to change the background colour    So  I dug deeper into the zip it generates  and tried to narrow down what are the parts that matter  so I can make the minimum amount of changes to my app  Below is what I found out      In the style generator  the relevant setting is Popup color  which affects  Overflow menu  submenu and spinner panel background      Go on and generate the zip  but out of all the files generated  you only really need one image  menu dropdown panel example 9 png  which looks something like this       So  add the different resolution versions of it to res drawable-    And perhaps rename them to menu dropdown panel 9 png    Then  as an example  in res values themes xml you would have the following  with android popupMenuStyle and android popupBackground being the key settings    lt resources gt        lt style name  MyAppActionBarTheme  parent  android Theme Holo Light  gt           lt item name  android popupMenuStyle  gt  style MyApp PopupMenu lt  item gt           lt item name  android actionBarStyle  gt  style MyApp ActionBar lt  item gt       lt  style gt        lt  -- The beef  background color for Action Bar overflow menu -- gt       lt style name  MyApp PopupMenu  parent  android Widget Holo Light ListPopupWindow  gt           lt item name  android popupBackground  gt  drawable menu dropdown panel lt  item gt       lt  style gt        lt  -- Bonus  if you want to style whole Action Bar  not just the menu -- gt       lt style name  MyApp ActionBar  parent  android Widget Holo Light ActionBar Solid  gt           lt  -- Blue background color  amp  black bottom border -- gt           lt item name  android background  gt  drawable blue action bar background lt  item gt       lt  style gt       lt  resources gt    And  of course  in AndroidManifest xml    lt application     android theme   style MyAppActionBarTheme            gt    What you get with this setup     Note that I m using Theme Holo Light as the base theme  If you use Theme Holo  Holo Dark   there s an additional step needed as this answer describes   Also  if you  like me  wanted to style the whole Action Bar  not just the menu  put something like this in res drawable blue action bar background xml     lt  -- Bonus  if you want to style whole Action Bar  not just the menu -- gt   lt layer-list xmlns android  http   schemas android com apk res android   gt        lt item gt           lt shape android shape  rectangle  gt               lt stroke android width  2dp  android color   FF000000    gt               lt solid android color   FF2070B0    gt                              lt  shape gt       lt  item gt        lt item android bottom  2dp  gt           lt shape android shape  rectangle  gt               lt stroke android width  2dp  android color   FF2070B0    gt               lt solid android color   00000000    gt               lt padding android bottom  2dp    gt           lt  shape gt       lt  item gt    lt  layer-list gt    Works great at least on Android 4 0   API level 14

User · Answer

There is an easy way to change the colors in Actionbar  Use ActionBar Generator and copy paste all file in your res folder and change your theme in Android manifest file

User · Answer

You can apply styles and Themes in Overflow MenuItem as per below  OverFlow Menu is ListView so  we can apply theme as per listview   Apply below code in styles xml   lt style name  AppTheme  parent   android style Theme Holo Light  gt   lt item name  android dropDownListViewStyle  gt  style PopupMenuListView lt  item gt           lt item name  android actionBarWidgetTheme  gt  style PopupMenuTextView lt  item gt           lt item name  android popupMenuStyle  gt  style PopupMenu lt  item gt           lt item name  android listPreferredItemHeightSmall  gt 40dp lt  item gt   lt  style gt    lt  -- Change Overflow Menu ListView Divider Property -- gt       lt style name  PopupMenuListView  parent   android style Widget Holo ListView DropDown  gt           lt item name  android divider  gt  color app navigation divider lt  item gt           lt item name  android dividerHeight  gt 1sp lt  item gt           lt item name  android listSelector  gt  drawable list selector lt  item gt       lt  style gt        lt  -- Change Overflow Menu ListView Text Size and Text Size -- gt       lt style name  PopupMenuTextView  parent   android style Widget Holo Light TextView  gt           lt item name  android textColor  gt  color app white lt  item gt           lt item name  android textStyle  gt normal lt  item gt           lt item name  android textSize  gt 18sp lt  item gt           lt item name  android drawablePadding  gt 25dp lt  item gt           lt item name  android drawableRight  gt  drawable navigation arrow selector lt  item gt       lt  style gt        lt  -- Change Overflow Menu Background -- gt       lt style name  PopupMenu  parent  android Widget Holo Light ListPopupWindow  gt           lt item name  android popupBackground  gt  drawable menu overflow bg lt  item gt       lt  style gt

User · Answer

Following are the changes required in your theme for changing action bar  amp  overflow menu background color  You need to configure  android background  of actionBarStyle  amp  popupMenuStyle   lt application             android name                    android theme   style AppLightTheme  gt    lt style name  AppLightTheme  parent  android Theme Holo Light  gt                 lt item name  android actionBarStyle  gt  style ActionBarLight lt  item gt           lt item name  android popupMenuStyle  gt  style ListPopupWindowLight lt  item gt   lt  style gt    lt style name  ActionBarLight  parent  android style Widget Holo Light ActionBar  gt           lt item name  android background  gt  color white lt  item gt   lt  style gt     lt style name  ListPopupWindowLight parent   android style Widget Holo Light ListPopupWindow  gt           lt item name  android background  gt  color white lt  item gt   lt  style gt

User · Answer

My simple trick to change background color and color of the text in Popup Menu   Option Menu   lt style name  CustomActionBarTheme         parent   android style Theme Holo  gt       lt item name  android popupMenuStyle  gt  style MyPopupMenu lt  item gt       lt item name  android itemTextAppearance  gt  style TextAppearance lt  item gt   lt  style gt   lt  -- Popup Menu Background Color styles -- gt   lt style name  MyPopupMenu          parent   android style Widget Holo ListPopupWindow  gt       lt item name  android popupBackground  gt  color Your color for background lt  item gt    lt  style gt   lt  -- Popup Menu Text Color styles -- gt   lt style name  TextAppearance  gt       lt item name  android textColor  gt  color Your color for text lt  item gt   lt  style gt

User · Answer

Try this code  Add this snippet to your res values styles xml   lt style name  AppTheme  parent  AppBaseTheme  gt       lt item name  android actionBarWidgetTheme  gt  style Theme stylingactionbar widget lt  item gt   lt  style gt   lt style name  PopupMenu  parent   android style Widget Holo ListPopupWindow  gt       lt item name  android popupBackground  gt  color DarkSlateBlue lt  item gt    lt  -- for  color you have to create a color xml in res  gt  values -- gt   lt  style gt   lt style name  Theme stylingactionbar widget  parent   android style Theme Holo  gt       lt item name  android popupMenuStyle  gt  style PopupMenu lt  item gt   lt  style gt    And in Manifest xml add below snippet under application    lt application     android allowBackup  true      android icon   drawable ic launcher      android label   string app name        android theme   style AppTheme    gt

User · Answer

In case people are still visiting for a working solution  here is what worked for me --  This is for Appcompat support library  This is in continuation to ActionBar styling  explained here  Following is the styles xml file    lt resources gt       lt  -- Base application theme  -- gt       lt style name  AppTheme  parent  Theme AppCompat Light  gt           lt  -- This is the styling for action bar -- gt           lt item name  actionBarStyle  gt  style MyActionBar lt  item gt           lt  --To change the text styling of options menu items lt  item gt -- gt           lt item name  android itemTextAppearance  gt  style MyActionBar MenuTextStyle lt  item gt           lt  --To change the background of options menu-- gt           lt item name  android itemBackground  gt  color skyBlue lt  item gt       lt  style gt        lt style name  MyActionBar  parent   style Widget AppCompat Light ActionBar Solid Inverse  gt           lt item name  background  gt  color red lt  item gt           lt item name  titleTextStyle  gt  style MyActionBarTitle lt  item gt       lt  style gt        lt style name  MyActionBarTitle  parent   style TextAppearance AppCompat Widget ActionBar Title  gt           lt item name  android textColor  gt  color white lt  item gt       lt  style gt        lt style name  MyActionBar MenuTextStyle          parent  style TextAppearance AppCompat Widget ActionBar Title  gt           lt item name  android textColor  gt  color red lt  item gt           lt item name  android textStyle  gt bold lt  item gt           lt item name  android textSize  gt 25sp lt  item gt       lt  style gt   lt  resources gt    and this is how it looks--MenuItem background color is skyblue and MenuItem text color is pink with textsize as 25sp --

User · Answer

FAST way   styles xml   lt style name  popupTheme  parent  Theme AppCompat Light  gt        lt item name  android background  gt  color colorBackground lt  item gt       lt item name  android textColor  gt  color colorItem lt  item gt    lt  style gt    Then add this specific styles to your AppTheme styles   lt style name  AppTheme  parent  Theme AppCompat Light NoActionBar  gt               lt item name  popupTheme  gt  style popupTheme lt  item gt   lt  style gt    DONE

User · Answer

Within your app theme you can set the android itemBackground property to change the color of the action menu    For example     x000D   x000D   lt style name  AppThemeDark  parent  Theme AppCompat Light DarkActionBar  gt  x000D           lt item name  colorPrimary  gt  color drk colorPrimary lt  item gt  x000D           lt item name  colorPrimaryDark  gt  color drk colorPrimaryDark lt  item gt  x000D           lt item name  colorAccent  gt  color drk colorAccent lt  item gt  x000D           lt item name  actionBarStyle  gt  style NoTitle lt  item gt  x000D           lt item name  windowNoTitle  gt true lt  item gt  x000D           lt item name  android textColor  gt  color white lt  item gt  x000D   x000D           lt  -- THIS IS WHERE YOU CHANGE THE COLOR -- gt  x000D           lt item name  android itemBackground  gt  color drk colorPrimary lt  item gt  x000D   lt  style gt  x000D   x000D   x000D

User · Answer

Add following to your Styles xml   lt style name  Custom Theme  parent  Theme AppCompat Light DarkActionBar  gt        lt item name  android itemBackground  gt  color white lt  item gt       lt item name  android textColor  gt  color colorPrimaryDark lt  item gt    lt  style gt    Change theme in activity main xml only   android theme   style Custom Theme

User · Answer

If you read this  it s probably because all the previous answers didn t work for your Holo Dark based theme    Holo Dark uses an additional wrapper for the PopupMenus  so after doing what Jonik suggested you have to add the following style to your  xml  file    lt style name  PopupWrapper  parent   android style Theme Holo  gt       lt item name  android popupMenuStyle  gt  style YourPopupMenu lt  item gt   lt  style gt    Then reference it in your theme block    lt style name  Your cool Theme  parent   android style Theme Holo  gt                         lt item name  android actionBarWidgetTheme  gt  style PopupWrapper lt  item gt   lt  style gt    That s it

User · Answer

I m also struck with this same problem  finally i got simple solution  just added one line to action bar style    lt style name  AppTheme AppBarOverlay  parent  ThemeOverlay AppCompat Dark ActionBar  gt       lt item name  android textColorPrimary  gt  color colorAccent lt  item gt       lt item name  android colorBackground  gt  color colorAppWhite lt  item gt   lt  style gt     android colorBackground  is enough to change option menu background

User · Answer

lt style name  customTheme  parent  any parent theme  gt       lt item name  android itemBackground  gt  424242 lt  item gt       lt item name  android itemTextAppearance  gt  style TextAppearance lt  item gt   lt  style gt    lt style name  TextAppearance  gt       lt item name  android textColor  gt  E9E2BF lt  item gt   lt  style gt

User · Answer

To alter the color of the app bar only  you just have to change the colorPrimary value inside the colors xml file and the colorPrimaryDark if you want to change the battery bar color as well    lt resources gt     lt color name  colorPrimary  gt  B90C0C lt  color gt     lt color name  colorPrimaryDark  gt  B90C0C lt  color gt     lt color name  colorAccent  gt  D81B60 lt  color gt   lt  resources gt

User · Answer

I used this and it works just fine   Apply this code in the onCreate   function  val actionBar  android support v7 app ActionBar    supportActionBar     actionBar  setBackgroundDrawable ColorDrawable Color parseColor  Your color code here

User · Answer

I was able to change colour of action overflow by just putting hex value at        lt  -- The beef  background color for Action Bar overflow menu -- gt   lt style name  MyApp PopupMenu  parent  android Widget Holo Light ListPopupWindow  gt       lt item name  android popupBackground  gt HEX VALUE OF COLOR lt  item gt   lt  style gt

[android] How to change the background color of Action Bar's Option Menu in Android 4.2?

Examples related to android

Examples related to android-actionbar

Examples related to android-4.2-jelly-bean

Examples related to android-theme

Examples related to android-menu