how to Customize the Contextual Action Bar using appCompat in material design

Question

MainActivity.java

I've implemented MultiChoiceModeListener in this class and below is the code:

on listView:

listView.setMultiChoiceModeListener(MainActivity.this); listView.setChoiceMode(listView.CHOICE_MODE_MULTIPLE_MODAL);       @Override     public boolean onActionItemClicked(ActionMode arg0, MenuItem arg1) {         switch (arg1.getItemId()) {         case R.id.save:              // Close CAB             arg0.finish();             return true;          case R.id.saveto:               // Close CAB             arg0.finish();             return true;         default:             return false;         }     }      @Override     public boolean onCreateActionMode(ActionMode arg0, Menu arg1) {         arg0.getMenuInflater().inflate(R.menu.save_menu, arg1);         return true;      }      @Override     public void onDestroyActionMode(ActionMode arg0) {         listadaptor.removeSelection();     }      @Override     public boolean onPrepareActionMode(ActionMode arg0, Menu arg1) {         return false;     }      @Override     public void onItemCheckedStateChanged(ActionMode arg0, int arg1, long arg2,             boolean arg3) {          final int checkedCount = listView.getCheckedItemCount();         arg0.setTitle(checkedCount + " "+getResources().getString(R.string.selected));         listadaptor.toggleSelection(arg1);     } 

style.xml

 <style name="AppTheme.Base" parent="Theme.AppCompat.Light">         <item name="colorPrimary">@color/colorPrimary</item>         <item name="colorPrimaryDark">@color/colorPrimaryDark</item>         <item name="colorAccent">@color/White</item>         <item name="android:windowNoTitle">true</item>         <item name="windowActionModeOverlay">true</item>         <item name="windowActionBar">false</item>         <item name="actionModeStyle">@style/LStyled.ActionMode</item>     </style>      <!-- Application theme. -->     <style name="AppTheme" parent="AppTheme.Base">         <!-- All customizations that are NOT specific to a particular API-level can go here. -->     </style>      <style name="LStyled.ActionMode" parent="@style/Widget.AppCompat.ActionMode">         <item name="background">@color/colorPrimary</item>     </style>      <style name="ActionBarThemeOverlay" parent="Theme.AppCompat.Light">         <item name="android:textColorPrimary">#fff</item>         <item name="colorControlNormal">#fff</item>         <item name="colorControlHighlight">#3fff</item>     </style>      <style name="HeaderBar">         <item name="android:background">#009688</item>         <item name="android:textStyle">bold</item>     </style>      <style name="ActionBarPopupThemeOverlay" parent="ThemeOverlay.AppCompat.Light">         <item name="android:textColor">#000</item>     </style> 

below is my screenshots:

you can see both screenshots, in second screenshot, actionmode background is white and text color is also white.. i want to change it to first screenshots color which is in top.

Answer 1

You can change the ActionMode background through attribute actionModeStyle:

<style name="AppTheme.Base" parent="Theme.AppCompat.Light">     ....     ....     <item name="actionModeStyle">@style/LStyled.ActionMode</item> </style>  <style name="LStyled.ActionMode" parent="@style/Widget.AppCompat.ActionMode">     <item name="background">@color/color_action_mode_bg</item> </style> 

You will of course need to define a color named color_action_mode_bg:

<color name="color_action_mode_bg">#009688</color> 

There are other things you can change as well. Example:

<item name="titleTextStyle">...</item> <item name="subtitleTextStyle">...</item> <item name="height">...</item> 

To change text color of SAVE and SAVETO, add the following to AppTheme.Base:

<item name="actionMenuTextColor">@color/color_action_mode_text</item>