Is there a way to show Divider between the Menu Items in ActionBar for HoneyComb+.
Some post says that the Divider will be shown only when the menu items has android:showAsAction="withText".
I want to show only the Icon not the Text.
I successfully shown Divider for Pre-HoneyComb by implementing a Action Bar Compatibility.
I dont want to use ActionBarSherlock as given in this post Android actionbar sherlok doesn't show divider because it will be time to change from Action Bar Compatibility to ActionBarSherlock in my all Projects.
When i saw the Android Source i found that Divider will be show only when it has text as shown below (from ActionMenuItemView)
public boolean needsDividerBefore() {
return hasText() && mItemData.getIcon() == null;
}
public boolean needsDividerAfter() {
return hasText();
}
Is there a way that I can give my Implementation for ActionMenuItemView for ActionBar where needsDividerBefore() will always give true
I found an answer by myself with help of http://android-developers.blogspot.in/2011/04/customizing-action-bar.html However, this does not completely solve my problem. It adds a divider for Title, and also one for the home Icon. There are also left and right separators. That too is adjustable.
I added android:selectableItemBackground to my theme.
<item name="android:selectableItemBackground">#drawable/action_bar_item_selector</item>
action_bar_item_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/actionbar_compat_separator"></item>
<item android:left="1dp" android:drawable="#drawable/actionbar_compat_item"></item>
</layer-list>
actionbar_compat_separator - is my seperator drawable
and actionbar_compat_item is my selector for action bar item.
EDITED
I have found a better solution to my problem. It works well.
<item name="android:actionButtonStyle">#style/ActionButton</item> to my Theme
<style name="ActionButton" parent="android:style/Widget.Holo.Light.ActionButton">
<item name="android:background">#drawable/action_bar_item_selector</item>
</style>
You can override existing theme with custom styles, for e.g.
<style name="CustomTheme" parent="android:Theme.Holo.Light">
<item name="android:actionBarStyle">#style/ActionBar</item>
</style>
<style name="ActionBar" parent="android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">#color/action_bar_background</item>
<item name="android:showDividers">beginning</item>
<item name="android:divider">#color/action_bar_divider</item>
</style>
Update: This doesn't seem to work for Android 5 Lollipop and above:
This is the best way I found. Just add a group with a dummy item to your menu:
menu.xml
<group>
<!--dummy item to get a nice separator-->
<item
android:title=""
android:showAsAction="always"
android:enabled="false" />
</group>
<item android:id="#+id/action_example"
...
The dummy item has an empty title so it appears invisible, and it's disabled so it can't be clicked.
Related
Is there a way to show Divider between the Menu Items in ActionBar for HoneyComb+.
Some post says that the Divider will be shown only when the menu items has android:showAsAction="withText".
I want to show only the Icon not the Text.
I successfully shown Divider for Pre-HoneyComb by implementing a Action Bar Compatibility.
I dont want to use ActionBarSherlock as given in this post Android actionbar sherlok doesn't show divider because it will be time to change from Action Bar Compatibility to ActionBarSherlock in my all Projects.
When i saw the Android Source i found that Divider will be show only when it has text as shown below (from ActionMenuItemView)
public boolean needsDividerBefore() {
return hasText() && mItemData.getIcon() == null;
}
public boolean needsDividerAfter() {
return hasText();
}
Is there a way that I can give my Implementation for ActionMenuItemView for ActionBar where needsDividerBefore() will always give true
I found an answer by myself with help of http://android-developers.blogspot.in/2011/04/customizing-action-bar.html However, this does not completely solve my problem. It adds a divider for Title, and also one for the home Icon. There are also left and right separators. That too is adjustable.
I added android:selectableItemBackground to my theme.
<item name="android:selectableItemBackground">#drawable/action_bar_item_selector</item>
action_bar_item_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/actionbar_compat_separator"></item>
<item android:left="1dp" android:drawable="#drawable/actionbar_compat_item"></item>
</layer-list>
actionbar_compat_separator - is my seperator drawable
and actionbar_compat_item is my selector for action bar item.
EDITED
I have found a better solution to my problem. It works well.
<item name="android:actionButtonStyle">#style/ActionButton</item> to my Theme
<style name="ActionButton" parent="android:style/Widget.Holo.Light.ActionButton">
<item name="android:background">#drawable/action_bar_item_selector</item>
</style>
You can override existing theme with custom styles, for e.g.
<style name="CustomTheme" parent="android:Theme.Holo.Light">
<item name="android:actionBarStyle">#style/ActionBar</item>
</style>
<style name="ActionBar" parent="android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">#color/action_bar_background</item>
<item name="android:showDividers">beginning</item>
<item name="android:divider">#color/action_bar_divider</item>
</style>
Update: This doesn't seem to work for Android 5 Lollipop and above:
This is the best way I found. Just add a group with a dummy item to your menu:
menu.xml
<group>
<!--dummy item to get a nice separator-->
<item
android:title=""
android:showAsAction="always"
android:enabled="false" />
</group>
<item android:id="#+id/action_example"
...
The dummy item has an empty title so it appears invisible, and it's disabled so it can't be clicked.
i'm in need to have custom image background with a logo, the problem is that backgound is white. I got it to work with this
<style name="CustomActionBarTheme"
parent="#android:style/Theme.Holo.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/MyActionBar</item>
</style>
<!-- ActionBar styles -->
<style name="MyActionBar"
parent="#android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
<item name="android:background">#drawable/activity_grey</item>
<item name="actionMenuTextColor">#android:color/black</item>
<item name="android:actionMenuTextColor">#android:color/black</item>
<item name="android:itemTextAppearance">#style/TextAppearance</item>
Now my problem it this: My background color is WHITE and the settings dots on the right top corner are white as well.. How can i change those 3 dots from white color to black??? I spent the weekend trying different solution but nothing worked..
Remember, i need to keep the background image for my acitonBar (which already works) + i need to make that actionBar Settings icon in the dark colors..
Thanks!
ps. my temp workAround is that i'm using Grey background instead so the icon is somewhat visible, but that is not right..
Create a folder under res named menu and create main_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:id="#+id/menu_item"
android:icon="#drawable/ic_"
android:title="#string/menu_item"
app:showAsAction="always"/>
</menu>
Download item menu black/grey from here
https://android.googlesource.com/platform/frameworks/base/+/master/core/res/res/
or you can also your own icon and add it in your drawable
and this in main your Main Activity class
#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, menu);
return true;
}
Hope this will help :)
Customize your Theme like this:
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#color/app_color_Primary</item>
<item name="colorPrimaryDark">#color/app_color_primary_dark</item>
<item name="colorAccent">#color/app_color_accent</item>
</style>
And <item name="colorPrimary">#color/app_color_Primary</item> will render your ActionBar's background.
I want show dividers between menu items in android actionbar
Icon1 | Icon2 | icon3
my code for showing menu items is
<item
android:id="#+id/menu_time"
android:icon="#drawable/action_time_btn_stateful"
android:title="time"
peel:showAsAction="always"/>
<item android:id="#+id/menu_room_change"
android:icon="#drawable/action_room_btn_stateful"
android:title="change"
peel:showAsAction="always"/>
<item
android:id="#+id/menu_like_set"
android:icon="#drawable/like_button"
android:title="Like"
peel:showAsAction="always" />
Thanks in advance.
Simply put,
your actionbar in ICS and later version is limited to show 4 items in menu.
The rest of the items can be shown when you tap on overflow menu (vertical 3 dotted line).
So adding a divider between items counts divider is also a menu item.
Did you take a look at these already :)
Is there a standard way to add dividers between action bar items in Android 3.0?
ActionBar MenuItem Divider
I suggest get your icons with divider on their left or right based on your requirement.
Not a good practice. But let me know if you find a better solution :)
Try setting custom style
<style name="CustomTheme" parent="android:Theme.Holo.Light">
<item name="android:actionBarStyle">#style/ActionBar</item>
</style>
<style name="ActionBar" parent="android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">#color/action_bar_background</item>
<item name="android:showDividers">beginning</item>
<item name="android:divider">#color/action_bar_divider</item>
</style>
I'm having two issues using the V7 support version of Action Bar Activity.
This is what my application looks like:
And this is how I want it to look:
The first issues is that the text apart from the title is showing up black instead of grey.
I'm using the Display Home As Up Enabled option, but you can't see the arrow because its black on a black background as shown above (the arrow is there if you look really hard!)
This is the style I'm using for the actionbar - I'm fairly sure I'm doing something wrong here, but I can't figure out what:
<style name="PropertyCrossTheme" parent="#style/Theme.AppCompat.Light">
<!-- Any customizations for your app running on pre-3.0 devices here -->
<item name="android:actionBarStyle">#style/ActionBar</item>
<item name="android:actionMenuTextAppearance">#style/ActionBar.MenuTextStyle</item>
</style>
<style name="ActionBar" parent="android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">#drawable/actionbar_background</item>
<item name="android:titleTextStyle">#style/ActionBar.TitleText</item>
</style>
<style name="ActionBar.TitleText" parent="#android:style/TextAppearance">
<item name="android:textColor">#android:color/white</item>
</style>
<style name="ActionBar.MenuTextStyle" parent="android:style/TextAppearance">
<item name="android:textColor">#android:color/white</item>
</style>
The second issue is that my add to favourite/remove from favourite option is always being pushed into hidden menu.
This is my menu xml:
<item android:id="#+id/favourites_add_item" android:title="#string/favourites_add"
android:icon="#drawable/nostar" android:showAsAction="always|withText" />
<item android:id="#+id/favourites_remove_item" android:title="#string/favourites_remove"
android:icon="#drawable/star" android:showAsAction="always|withText" />
And in code I'm adding the menu like this (I know it's c# - I'm using Xamarin, but I don't think that's the reason for the issue, so please just pretend it's java :-D):
public override bool OnCreateOptionsMenu(IMenu menu)
{
MenuInflater.Inflate(Resource.Menu.favourites_toggle, menu);
return true;
}
public override bool OnPrepareOptionsMenu(IMenu menu)
{
IMenuItem addItem = menu.FindItem(Resource.Id.favourites_add_item);
addItem.SetVisible(!IsFavourited);
IMenuItem removeItem = menu.FindItem(Resource.Id.favourites_remove_item);
removeItem.SetVisible(IsFavourited);
return true;
}
Thanks
Ross
In the menu xml, try removing "|withText", so it looks like:
<item android:id="#+id/favourites_add_item" android:title="#string/favourites_add"
android:icon="#drawable/nostar" android:showAsAction="always" />
<item android:id="#+id/favourites_remove_item" android:title="#string/favourites_remove"
android:icon="#drawable/star" android:showAsAction="always" />
You are using Support v7, hence you need to use:
app:showAsAction="always|withText"
instead of
android:showAsAction="always|withText"
app should be:
xmlns:app="http://schemas.android.com/apk/res-auto"
Note, that when using withText you are forcing it to show the text associated with the Menu item, you probably don't want if you only want that star to show.
I have two questions. Before detailing these questions, I want to add I'm using ActionBarSherlock.
The first question would be that I am having issues with adding a divider between ActionItems in my ActionBar. In the printscreen, there are 3 dividers, for instance the first one is between the back button and Check In.
I customized my ActionBar using the style below. However, the drawable called small_detail_divider does not show up. I also tried adding this divider programmatically, using the setBackgroundSplitDrawable(). That did not help either. What should I do to add divider between those ActionItems?
<style name="Theme.Example" parent="Theme.Sherlock">
<item name="actionBarStyle">#style/Widget.Styled.ActionBar</item>
<item name="absForceOverflow">true</item>
</style>
<style name="Widget.Styled.ActionBar" parent="Widget.Sherlock.ActionBar.Solid">
<item name="background">#drawable/top_panel_background</item>
<item name="icon">#drawable/application_logo</item>
<item name="backgroundSplit">#drawable/small_detail_divider</item>
<item name="android:background">#drawable/top_panel_background</item>
<item name="android:icon">#drawable/application_logo</item>
<item name="android:backgroundSplit">#drawable/small_detail_divider</item>
</style>
Another question would be: I want to add action items in the same manner as they are added within the printscreen. When I add the action items, they are always added to the right of the ActionBar. How can I add an action item to the left of the ActionBar such as the Back Button in the printscreen? Any suggestion would help.
the attribute you are looking for is:
<style name="Theme.Example" parent="Theme.Sherlock">
<item name="actionBarDivider">#drawable/small_detail_divider</item>
....
<item name="android:actionBarDivider">#drawable/small_detail_divider</item>
...
</style>
Just to give you some more info.
The split ActionBar should be set with:
<style name="Theme.Example" parent="Theme.Sherlock">
<item name="actionBarSplitStyle">#style/Widget.Styled.ActionBarSplit</item>
<item name="android:actionBarSplitStyle">#style/Widget.Styled.ActionBarSplit</item>
...
Then provide your custom style for the split action bar..
Thrid question: Adding in order:
When you add the menu item pragmatically use: Menu
menu.add (0, R.id.menu_new_ab_item, 0, "Item");
The order determines how you order your menu items.
You can be more specific in your menu.xml files android:orderInCategory="1..n" can be any int. I normally start at 10 or so, so I can inflate items in-front of the standard items.