Sherlock动作栏的菜单项背景

Question

i am having issue with rendering custom view in Sherlock action bar. what happen is i've successfully set the custom view in action bar designed to set the Title textview in center, but when i set the other menu items like refresh then it's background appears with black color. same things happens with home button. please go through the following snapshot.

as you can see in this image when i set home button visible or set the refresh menu item it should not displayed like this with black background.

in my Activity screen

protected void onCreate(Bundle savedInstanceState) {
   super.onCreate(savedInstanceState);
   setContentView(R.layout.menu_activity);
   .... 
   View customNav = LayoutInflater.from(this).inflate(R.layout.custom_navigation, null);
   TextView textView = (TextView)customNav.findViewById(R.id.screen_title);
   textView.setText("Category");
   getSupportActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
   getSupportActionBar().setCustomView(customNav);
   getSupportActionBar().setDisplayHomeAsUpEnabled(true);
   getSupportActionBar().setDisplayShowHomeEnabled(true);   
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    menu.add(0,Constants.REFRESH_ITEM_ID,0,Constants.LABEL_REFRESH)
        .setIcon(R.drawable.ic_refresh)
        .setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS);
    return true;
}

I've tried a lot but fail to fix it.Please help me. Thanks in Advance.

Answer 1

It seems you use Theme.Sherlock.Dark in manifest file for whole application or this activity. It is normal behavior of ActionBar -- it is defined by style, but your custom view-element has is own backround, text style, etc... From setCustomView() javadoc:

Custom navigation views appear between the application icon and any action buttons and may use any space available there.

This method just add new view to bar, but doesn't set 'view for whole bar'.

Take a look at http://jgilfelt.github.com/android-actionbarstylegenerator -- this is a style generator for action bar. Pay attention to the toggle button "Style compatibility".

Answer 2

I have found the solution of this not exactly the way i wanted but the other way. actually i've created the images with centred screen title for various screens and setting it as the action bar background rather than creating a custom view and SherlockActionBar is flexible enough to hide the default title displayed on the upper-left corner. all i have done is.

getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowTitleEnabled(false);
getSupportActionBar()
            .setBackgroundDrawable(getResources().getDrawable(R.drawable.menu_head));