Develop Reference

Custom action bar is overlapping other elements

I am trying to implement a custom action bar in an activity. I have done so below, but am getting my custom action bar overlapped with another. I have attached the screen shot below.
public class MainActivity extends ActionBarActivity {
private TextView actionBarTitle;
#Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
ActionBar actionBar = getSupportActionBar();
View customView=getLayoutInflater().inflate(R.layout.actionbar_layout, null);
actionBar.setCustomView(customView);
actionBarTitle =(TextView)findViewById(R.id.actionbar_text);
actionBarTitle.setText("Action bar");
}
}
Manifest:
<application
android:name="MyApplication"
android:allowBackup="true"
android:icon="#drawable/ic_launcher"
android:label="#string/app_name"
android:theme="#style/AppBaseTheme"
android:requiredForAllUsers="false">
<activity android:name="MainActivity"
android:screenOrientation="portrait"/>
</application>
actionbar_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:orientation="vertical" >
<ImageView
android:id="#+id/actionbar_icon"
android:layout_width="wrap_content"
android:layout_height="32dp"
android:layout_alignParentTop="true"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/actionbar_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_toRightOf="#+id/actionbar_icon"
android:text="title" />
</RelativeLayout>
strings.xml:
<resources>
<string name="app_name">sample</string>
</resources>
styles.xml
<resources>
<!--
Base application theme, dependent on API level. This theme is replaced
by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
-->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
<!--
Theme customizations available in newer API levels can go in
res/values-vXX/styles.xml, while customizations related to
backward-compatibility can go here.
-->
</style>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
</style>
<style name="Dialog_No_Border">
<item name="android:windowIsFloating">true</item>
<item name="android:windowBackground">#color/transparent_color</item>
</style>
</resources>
How can I remove the sample text and black background so that only the custom view is displayed?

What you are showing in your screenshot is exactly what the specification says is supposed to happen. When you use a custom view in the action bar, it is placed in between where the app icon (if any) on the left side of the action bar and the action buttons (if any) on the right side of the action bar.
Custom navigation views appear between the application icon and any action buttons and may use any space available there.
ActionBar#setCustomView(View view)

try to Extend from Activity class and use Actionbar.
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ActionBar actionBar = getActionBar();
**actionBar.setDisplayShowHomeEnabled(false);
actionBar.setDisplayShowTitleEnabled(false);**
LayoutInflater mInflater = LayoutInflater.from(this);
View mCustomView = mInflater.inflate(R.layout.custom_actionbar, null);
TextView mTitleTextView = (TextView) mCustomView.findViewById(R.id.title_text);
mTitleTextView.setText("your title here");
actionBar.setCustomView(mCustomView);
actionBar.setDisplayShowCustomEnabled(true);
It worked for me!by inflating custom actionbar! but make sure it doesn't hinder other layout or components.
ps : i have used this in one of my project and worked well,if you're going through any error/bug/suggestion correct me.

Removing Extra Space in Custom ActionBar

My issue concerns using fully custom ActionBar views (as it's necessary for how my customer wants the ActionBar to work). I've removed the logo, title, and everything else possible. However, the custom view for the ActionBar will not extend all the way across the screen.
I've tried the following (as a quick overview):
Dynamically removing aspects of the ActionBar (snippet below)
Removing the Options Menu in its entirety
Specifying in the Style/Theme to remove everything from the ActionBar
Here is a screenshot of my issue:
Here is the style: (as a side note, I originally kept the native ActionBar but removed most of it)
<!-- Customized App Theme -->
<style name="AppTheme2" parent="Theme.AppCompat.Light">
<!-- Let the actioBbar overlay the activity, ie activity is full screen -->
<item name="android:windowActionBarOverlay">true</item>
<!-- Set up the action bar styles -->
<item name="android:actionBarStyle">#style/ActionBarEmpty</item>
<!-- Remove the shadow under the actionBar -->
<item name="android:windowContentOverlay">#null</item>
<!-- Set the drawer icon to show up instead of the "Up" caret icon
<item name="android:homeAsUpIndicator">#drawable/ic_drawer</item>
<item name="homeAsUpIndicator">#drawable/ic_drawer</item>
-->
<!-- Support library compatibility -->
<item name="actionBarStyle">#style/ActionBarEmpty</item>
</style>
<!-- Final, empty Action Bar style | makes space for customized actionBar -->
<style name="ActionBarEmpty" parent="Widget.AppCompat.Base.ActionBar">
<!-- TODO: Add support versions -->
<item name="android:displayOptions">none</item>
<item name="android:background">#color/transparent</item>
<!-- Tested the below, does absolute nothing -->
<item name="android:layout_margin">0dp</item>
<item name="android:padding">0dp</item>
<item name="android:minWidth">0dp</item>
</style>
Here is the code in my Activity that concerns setting up the ActionBar:
// Initialize and set up the ActionBar
mActionBar = getActionBar();
mActionBar.setDisplayHomeAsUpEnabled(false);
mActionBar.setDisplayShowHomeEnabled(false);
mActionBar.setDisplayShowTitleEnabled(false);
mActionBar.setDisplayShowCustomEnabled(true);
// Set the actionBar layout initially to the simple one
mActionBar.setCustomView(mViewActionBarSimple);
Here is the view shown in the screenshot for the ActionBar:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="?android:actionBarSize"
android:background="#color/white">
<ImageButton
android:id="#+id/navButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="#dimen/padding_actionbar_icon"
android:paddingBottom="#dimen/padding_actionbar_icon"
android:paddingRight="#dimen/padding_actionbar_icon"
android:paddingEnd="#dimen/padding_actionbar_icon"
android:layout_marginLeft="#dimen/margin_actionbar_icon_left"
android:layout_marginStart="#dimen/margin_actionbar_icon_left"
android:src="#drawable/ic_drawer_normal"
android:background="?android:attr/selectableItemBackground"
/>
<TextView
android:id="#+id/textTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/margin_general"
android:layout_gravity="center"
android:textColor="#color/black"
android:textSize="#dimen/text_normal"
android:text="#string/garbage_fill_short"
/>
</LinearLayout>
In addition to trying to remove everything I could think of, I also tried to remove the options menu:
#Override
public boolean onCreateOptionsMenu(Menu menu) {
return false;
}
#Override
public boolean onPrepareOptionsMenu(Menu menu) {
// To remove the options menu - and make the custom actionBar take the full space -
// always return false
return false;
}
I'm running this on a Samsung Galaxy S4 with Android KitKat.
Thank you for reading this. Any help would be appreciated at this point.
Update: For anyone reading this, I don't know why it worked like this, but I came upon the problem after following the below answer. I surrounded the actionBar layout with a RelativeLayout [with the LinearLayout and its contents as the children], and the width/background fixed itself... The answer is still amazing as its very clear cut and absolutely removes the actionBar, while before I was still using it in some way.

Please try below for removing action bar content by creating base activity so you can refer in all your app & inflate custom action bar from layout
#SuppressLint("InlinedApi")
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
getSupportActionBar().hide();
ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayHomeAsUpEnabled(false);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayShowHomeEnabled(false);
actionBar.setHomeButtonEnabled(false);
actionBar.setIcon(new ColorDrawable(getResources().getColor(android.R.color.transparent)));
View homeIcon = findViewById(android.R.id.home);
// Hides the View (and so the icon)
if (homeIcon != null)
((View) homeIcon.getParent()).setVisibility(View.GONE);
overridePendingTransition(0, 0);
}
add custom view
#SuppressLint("InlinedApi")
#Override
public void setContentView(int layoutResID)
{
super.setContentView(R.layout.activity_base);
ViewGroup viewGroup = (ViewGroup) findViewById(R.id.container);
viewGroup.removeAllViews();
viewGroup.addView(getLayoutInflater().inflate(layoutResID, null));
// you can find action_bar layouts view & add listner
}
and customise XML containing custom action bar in activity_base.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="right"
android:orientation="vertical" >
<include layout="#layout/action_bar" />
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="right" />
</LinearLayout>
Where you want to use then extend this activity.

Custom View for ActionBar.Tab not displaying correctly

I currently have an actionBar implemented with tabbed navigation, and want to now customize the tabs themselves. I created a custom XML layout for each tab to have a textview and a clickable ImageButton, and used the ActionBar.Tab.setCustomView to set it. The problem is that none of the attributes for the layout seem to have any effect(such as alignment). Any help would be appreciated!
Here is an image showing what's produced: Image of what is being produced
My Custom Tab Layout XML file
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<TextView
android:id="#+id/tab_title"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_action_refresh"/>
</RelativeLayout>
ActionBar code:
final ActionBar actionBar = getActionBar();
//Because there is no 'parent' when navigating from the action bar, the home button for the Action Bar is disabled.
actionBar.setHomeButtonEnabled(false);
//Specify that the actionBar will include a tabbed navigation
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
// Setting up the ViewPager rowingViewPager, attaching the RowingFragmentPagerAdapter and setting up a listener for when the
// user swipes between sections.
rowViewPager = (ViewPager) findViewById(R.id.pager);
rowViewPager.setAdapter(rowAdapter);
rowViewPager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener()
{
#Override
public void onPageSelected(int position)
{
actionBar.setSelectedNavigationItem(position);
}
});
// For loop to add tabs for each fragment to the actionBar
for (int tab_counter = 0; tab_counter < rowAdapter.getCount(); tab_counter++)
{
Tab new_tab = actionBar.newTab();
new_tab.setCustomView(R.layout.custom_tab);
TextView tab_title = (TextView) new_tab.getCustomView().findViewById(R.id.tab_title);
tab_title.setText(rowAdapter.getTabTitle(tab_counter));
new_tab.setTabListener(this);
// Add tab with specified text as well as setting this activity as the TabListener.
actionBar.addTab(new_tab);
}
rowViewPager.setOffscreenPageLimit(2); //Sets the number of off-screen fragments to store and prevent re-load. Will increase if future fragments are added.
}

The problem lies in not customizing the actionBar layout itself, but rather altering the style. The default ActionBar has a property where the padding on the left and right is 16dp. You can do whatever you want in your tab layout, but it will not override this.
To do this, I simply wrote a new style in styles.xml for the ActionBar Tab where I overrode that padding and applied it to the actionBarTabStyle attribute in the application theme. Here is my new styles.xml which shows the change.
<resources>
<!--
Base application theme, dependent on API level. This theme is replaced
by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
-->
<style name="AppBaseTheme" parent="android:Theme.Light">
<!--
Theme customizations available in newer API levels can go in
res/values-vXX/styles.xml, while customizations related to
backward-compatibility can go here.
-->
</style>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
<item name="android:actionBarTabStyle">#style/ActionBarTabStyle</item>
</style>
<style name="ActionBarTabStyle" parent="#android:style/Widget.Holo.ActionBar.TabView">
<item name="android:paddingLeft">0dp</item>
<item name="android:paddingRight">0dp</item>
</style>
</resources>

Its very simple just remove the ImageView from your custom view and add it as drawable top/left/bottom/right for textview
ie
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/your_img"
android:text="Tab1"
/>

How to display custom view in ActionBar?

I want to display custom search in actionbar (I'm using ActionBarSherlock for that).
I got that:
But I want make custom layout (edittext field) to occupy the entire available width.
I've implemented custom layout as suggested here.
There is my custom layout search.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
style="?attr/actionButtonStyle"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_gravity="fill_horizontal"
android:focusable="true" >
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|fill_horizontal" >
<EditText
android:id="#+id/search_query"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="left|center"
android:background="#drawable/bg_search_edit_text"
android:imeOptions="actionSearch"
android:inputType="text" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|center_vertical"
android:src="#drawable/ic_search_arrow" />
</FrameLayout>
</LinearLayout>
And in MyActivity:
ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setIcon(R.drawable.ic_action_search);
LayoutInflater inflator = (LayoutInflater) this .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View v = inflator.inflate(R.layout.search, null);
actionBar.setCustomView(v);
How can I make custom layout to occupy all the available width of actionBar?
Help, please.

There is a trick for this. All you have to do is to use RelativeLayout instead of LinearLayout as the main container. It's important to have android:layout_gravity="fill_horizontal" set for it. That should do it.

I struggled with this myself, and tried Tomik's answer.
However, this didn't made the layout to full available width on start, only when you add something to the view.
You'll need to set the LayoutParams.FILL_PARENT when adding the view:
//I'm using actionbarsherlock, but it's the same.
LayoutParams layout = new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT);
getSupportActionBar().setCustomView(overlay, layout);
This way it completely fills the available space. (You may need to use Tomik's solution too).

This is how it worked for me (from above answers it was showing both default title and my custom view also).
ActionBar.LayoutParams layout = new ActionBar.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
// actionBar.setCustomView(view); //last view item must set to android:layout_alignParentRight="true" if few views are there
actionBar.setCustomView(view, layout); // layout param width=fill/match parent
actionBar.setDisplayShowCustomEnabled(true);//must other wise its not showing custom view.
What I noticed is that both setCustomView(view) and setCustomView(view,params) the view width=match/fill parent. setDisplayShowCustomEnabled (boolean showCustom)

The answers from Tomik and Peterdk work when you want your custom view to occupy the entire action bar, even hiding the native title.
But if you want your custom view to live side-by-side with the title (and fill all remaining space after the title is displayed), then may I refer you to the excellent answer from user Android-Developer here:
https://stackoverflow.com/a/16517395/614880
His code at bottom worked perfectly for me.

For example, you can define a layout file which contains a EditText element.
<?xml version="1.0" encoding="utf-8"?>
<EditText xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/searchfield"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:inputType="textFilter" >
</EditText>
you can do
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ActionBar actionBar = getActionBar();
// add the custom view to the action bar
actionBar.setCustomView(R.layout.actionbar_view);
EditText search = (EditText) actionBar.getCustomView().findViewById(R.id.searchfield);
search.setOnEditorActionListener(new OnEditorActionListener() {
#Override
public boolean onEditorAction(TextView v, int actionId,
KeyEvent event) {
Toast.makeText(MainActivity.this, "Search triggered",
Toast.LENGTH_LONG).show();
return false;
}
});
actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM
| ActionBar.DISPLAY_SHOW_HOME);
}

There is an example in the launcher app of Android (that I've made a library out of it, here), inside the class that handles wallpapers-picking ("WallpaperPickerActivity") .
The example shows that you need to set a customized theme for this to work. Sadly, this worked for me only using the normal framework, and not the one of the support library.
Here're the themes:
styles.xml
<style name="Theme.WallpaperPicker" parent="Theme.WallpaperCropper">
<item name="android:windowBackground">#android:color/transparent</item>
<item name="android:colorBackgroundCacheHint">#null</item>
<item name="android:windowShowWallpaper">true</item>
</style>
<style name="Theme.WallpaperCropper" parent="#android:style/Theme.DeviceDefault">
<item name="android:actionBarStyle">#style/WallpaperCropperActionBar</item>
<item name="android:windowFullscreen">true</item>
<item name="android:windowActionBarOverlay">true</item>
</style>
<style name="WallpaperCropperActionBar" parent="#android:style/Widget.DeviceDefault.ActionBar">
<item name="android:displayOptions">showCustom</item>
<item name="android:background">#88000000</item>
</style>
value-v19/styles.xml
<style name="Theme.WallpaperCropper" parent="#android:style/Theme.DeviceDefault">
<item name="android:actionBarStyle">#style/WallpaperCropperActionBar</item>
<item name="android:windowFullscreen">true</item>
<item name="android:windowActionBarOverlay">true</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
<style name="Theme" parent="#android:style/Theme.DeviceDefault.Wallpaper.NoTitleBar">
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
EDIT: there is a better way to do it, which works on the support library too. Just add this line of code instead of what I've written above:
getSupportActionBar().setDisplayShowCustomEnabled(true);

Setting a custom share icon on Actionbar ShareActionProvider

I'm trying to set the icon ShareActionProvider, need a solid white one instead of the semi transparent white one.
However setting in share_menu.xml and code doesn't work. Just wondering whether anyone has got workaround for this before extending the ShareActionProvider. (I'm using actionbarsherlock)
#Override
public void onCreateOptionsMenu(final Menu menu, final MenuInflater inflater) {
inflater.inflate(R.menu.share_menu, menu);
MenuItem actionItem = menu.findItem(R.id.share_action_provider);
ShareActionProvider actionProvider = (ShareActionProvider) actionItem.getActionProvider();
actionProvider.setShareIntent(mShareIntent);
// re-setting the icon as it's not being picked up from the menu xml file
actionItem.setIcon(R.drawable.ic_action_share);
super.onCreateOptionsMenu(menu, inflater);
}
share_menu.xml
<item android:id="#+id/share_action_provider"
android:showAsAction="ifRoom"
android:title="#string/share_with"
android:icon="#drawable/ic_action_share"
android:actionProviderClass="com.actionbarsherlock.widget.ShareActionProvider" />
Update:
Also tried setting it in the style, but no joy
<style name="Theme.MyApp" parent="Theme.Sherlock.Light">
<item name="actionModeStyle">#style/ActionModeStyle</item>
<item name="android:actionModeStyle">#style/ActionModeStyle</item>
</style>
<style name="ActionModeStyle" parent="Widget.Sherlock.ActionMode">
<item name="actionModeShareDrawable">#drawable/ic_action_share</item>
</style>

When I am looking to customize the action bar, usually the first place I look is the ActionBarSherlock themes and styles.
I found that the Sherlock theme uses the "actionModeShareDrawable" as found in theme.xml file.
Try changing your theme to include the "actionModeShareDrawable" item directly.
<style name="Theme.MyApp" parent="Theme.Sherlock.Light">
<item name="actionModeShareDrawable">#drawable/ic_action_share</item>
</style>

For AppCompat the changes to 2 styles are needed:
1)
<style name="MyAppTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<item name="actionBarWidgetTheme">#style/Theme.AppCompat.CustomShareIcon</item>
<item name="android:actionBarWidgetTheme">#style/Theme.AppCompat.CustomShareIcon</item>
</style>
In other words, specifiing attr:actionModeShareDrawable in your MyAppTheme is not what you really need, but it should be mentioned in your attr:actionBarWidgetTheme as following:
2)
<style name="Theme.AppCompat.CustomShareIcon" parent="#style/Theme.AppCompat">
<item name="actionModeShareDrawable">#drawable/abc_ic_menu_share_holo_dark</item> <!-- your icon goes here -->
</style>

UPDATE: Forget about the TRICKY way below, just sub-class ShareActionProvider, return null in onCreateActionView Method, and provide your own icon in menu.xml file, everything will be fine
===========================
I found a very tricky but none-ActionBarSherlock-specific way:
Sub-class ShareActionProvider, with just a little tweak:
#Override
public View onCreateActionView() {
View target = super.onCreateActionView();
ViewGroup viewGroup = (ViewGroup) LayoutInflater.from(context).inflate(R.layout.actionbutton_share, null);
ImageView overlay = (ImageView) viewGroup.findViewById(R.id.overlay);
ViewGroup container = (ViewGroup) viewGroup.findViewById(R.id.container);
container.addView(target);
container.getLayoutParams().width = overlay.getLayoutParams().width;
container.getLayoutParams().height = overlay.getLayoutParams().height;
return viewGroup;
}
Create a layout file (R.layout.actionbutton_share), which place the original view at top but transparent to user (Note the "android:alpha=0" part) :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:id="#+id/container"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:alpha="0" />
<ImageView
android:id="#+id/overlay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_marginLeft="7dp"
android:layout_marginRight="7dp"
android:src="#drawable/yours_whatever_share_icon"
tools:ignore="ContentDescription" />
</RelativeLayout>
Use the hacked ShareActionProvider in your menu.xml file

vivimice's solution is good, but the icon of last used app for sharing becomes hidden too.
I did custom share icon as a common menu item without any ShareActionProvider, just in onOptionsItemSelected() method used this code:
Intent sendIntent = new Intent();
sendIntent.setAction(Intent.ACTION_SEND);
sendIntent.putExtra(Intent.EXTRA_TEXT, "This is my text to send.");
sendIntent.setType("text/plain");
startActivity(Intent.createChooser(sendIntent, getResources().getText(R.string.send_to)));
It creates not a popup menu, but a chooser dialog.

You can override the non-public attribute like this.
<style name="Theme.MyApp" parent="android:Theme.Holo">
<item name="*android:actionModeShareDrawalbe">#drawable/icon</item>
</style>
(*) means reference to the non-public resources in Android