If i use sherlockActionBar with this code
menu.add(Menu.NONE, R.string.abc, Menu.NONE, R.string.abc)
.setIcon(R.drawable.ic_action_red_plus)
.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS | MenuItem.SHOW_AS_ACTION_WITH_TEXT);
It shows the icon with the text next to it on the right in UPPERCASE BOLD. Now, setting asside android icon guidelines, how can i change the color/shape of that text?
This is what i've tried but it has no effect:
<style name="MyTheme" parent="#style/Theme.Sherlock.Light">
<item name="android:textSize">20dp</item>
</style>
<style name="MyTheme.Styled" parent="Theme.Sherlock.Light.DarkActionBar">
<item name="actionBarStyle">#style/MyTheme.Styled.ActionBar</item>
<item name="android:actionBarStyle">#style/MyTheme.Styled.ActionBar</item>
</style>
<style name="MyTheme.Styled.ActionBar" parent="Widget.Sherlock.Light.ActionBar.Solid.Inverse">
<item name="background">#drawable/pdf2</item>
<item name="android:background">#drawable/logo</item>
</style>
Note that i'm not asking how to style the tabs text(which has answers on the site), but the action shown on the action bar and not the action shown in the drop down menu.
Thanks
The color is changed:
<style name="MyTheme" parent="Theme.Sherlock.Light">
<item name="android:actionMenuTextColor">#color/White</item>
<item name="actionMenuTextColor">#color/White</item>
</style>
Based on the XML layout in the ABS library, you could use
Activity.findViewById(R.id.abs__textButton)
That should return an extended version of the Android Button, which can have a custom typeface. This probably isn't a good idea because I don't think it will work on devices using a native ActionBar. You can try and see.
Also, you should not be using R.string.something as the id. You should create an id in XML and reference it using R.id.something or just define an int in you class.
EDIT:
I did some testing and if you do Activity.findViewById(menuItemId) on an ICS device you get a ViewGroup with an ImageButton and a Button. I can't give you their ids, but you could use getChildAt to get the Button child and apply the typeface to it.
Related
I need to change text size of action buttons in AppBar/Toolbar. It should be 14sp, but I'll use 20sp in this example, because it is more evident. I am using appcompat-v7 22.1.1
At first I tried to use theme attribute android:actionButtonStyle:
<style name="FirstAttemptTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:actionButtonStyle">#style/Custom.Widget.AppCompat.Light.ActionButton</item>
</style>
<style name="Custom.Widget.AppCompat.Light.ActionButton" parent="Widget.AppCompat.Light.ActionButton">
<item name="android:textSize">20sp</item>
</style>
Then I ran application on the Lollipop and the result was as needed:
But then I used an emulator with lower version and my theming had no effect:
I digged a little deeper and discovered that abc_action_menu_item_layout.xml is used for action menu items and it has a line android:textAppearance="?attr/actionMenuTextAppearance"
So I tried to modify this theme attribute (I also had to add textStyle:bold):
<style name="SecondAttemptTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:actionMenuTextAppearance">#style/Custom.TextAppearance.AppCompat.Widget.ActionBar.Menu</item>
</style>
<style name="Custom.TextAppearance.AppCompat.Widget.ActionBar.Menu" parent="TextAppearance.AppCompat.Widget.ActionBar.Menu">
<item name="android:textSize">20sp</item>
<item name="android:textStyle">bold</item>
</style>
As in the first time, the result was as needed on Lollipop and no effect on any version below.
So, the question is: how to properly change text size for action menu item?
PS: I created a simple project on github to demostrate my issue
It appears that actionButtonStyle and actionMenuTextAppearance should be used without android: namespace.
As it can be seen in values-v21/values.xml of support library, Lollipop uses attribute from system theme (note the android: prefix), that's why my attempts worked with it:
<style name="Base.V21.Theme.AppCompat.Light" parent="Base.V7.Theme.AppCompat.Light">
...
<item name="actionButtonStyle">?android:attr/actionButtonStyle</item>
...
</style>
I'm working on an android app and I am using ActionBarSherlock for compatibility. Everything works great so far, except the fact that I want to change the text color of the overflow menu items.
Here's the way they currently look:
Now, the reason for this is that I am usign Holo.Light.DarkActionBar as the Base theme since that way the icons are white, the text is white on the ActionBar's Title and SubTitle, and some other things.
To my knowledge, and per this question, I should be able to simply change the following:
<!-- For Values -->
<style name="Theme.Laprensa_compat_holo_light_dark_action_bar" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="spinnerItemStyle">#style/SpinnerItemStyle</item>
<!-- For Values-v14 -->
<style name="Theme.Laprensa_compat_holo_light_dark_action_bar" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="android:spinnerItemStyle">#style/SpinnerItemStyle</item>
And the SpinnerItemStyle is:
<style name="SpinnerItemStyle" parent="Widget.Sherlock.TextView.SpinnerItem">
<item name="android:textColor">#android:color/black</item>
</style>
Now, that doesn't seem to be working, so I added
<item name="spinnerItemStyle">#style/SpinnerItemStyle</item>
To the children theme too:
<style name="ActionBar.Solid.Laprensa_compat_holo_light_dark_action_bar" parent="#style/Widget.Sherlock.Light.ActionBar.Solid.Inverse">
It's still a no-go.
The Answer I referenced stated that i should make sure that I am using the correct adapter layout, but in reality, I am not inflating any code myself manually, it's the regular onCreateOptionsMenu implementation.
Any ideas on what could I change to make the text black? And you should know that changing actionMenuTextColor is for items hosted on the action bar itself, and doesn't change the overflow menu items
EDIT As per Matthias' answer, I tried the following style:
<style name="TextAppearance.Styled.Widget.PopupMenu.Large" parent="TextAppearance.Sherlock.Widget.PopupMenu.Large">
<item name="android:textColor">#android:color/black</item>
</style>
and used it on the main theme:
<style name="Theme.Laprensa_compat_holo_light_dark_action_bar" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="textAppearanceLargePopupMenu">#style/TextAppearance.Styled.Widget.PopupMenu.Large</item>
</style>
But the text is still non-visible.
<style name="AppTheme" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="android:textAppearanceLargePopupMenu">
#style/TextAppearance.Styled.Widget.PopupMenu.Large</item>
</style>
<style name="TextAppearance.Styled.Widget.PopupMenu.Large"
parent="TextAppearance.Sherlock.Widget.PopupMenu.Large">
<item name="android:textColor">?attr/textColorPrimaryInverse</item>
</style>
I would like custom background & text color for my overflow menu. It works fine with devices without hardware menu button, but I'm not able to style devices with hardware menu button. See the screenshots:
I'm using these styles:
<style name="Theme.settleup" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="android:popupMenuStyle">#style/settleup_PopupMenu</item>
<item name="android:actionMenuTextColor">#android:color/white</item>
</style>
<style name="settleup_PopupMenu" parent="#style/Widget.Sherlock.ListPopupWindow">
<item name="android:popupBackground">#drawable/menu_dropdown_panel_settleup</item>
</style>
I've looked into the problem. And there seems to be no way in changing textColor for the options menu for Android >= 4.0 devices with HW menu key. Not even changing primary, secondary or tertiary colors affected the text color.
The only "solution" that comes to my mind now is some pretty nasty use of java reflection API.
However, you can set the background of the bottom options menu of Android >= 4.0 HW key devices separately from the background of the non-HW key dropdown menu.
You already has the styling for non-HW key dropdown menu. The non-HW key dropdown menu is defined by android:popupMenuStyle (and popupMenuStyle):
<style name="Theme.settleup" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="android:popupMenuStyle">#style/settleup_PopupMenu</item>
</style>
But the background of the Android >= 4.0 HW key bottom options menu is defined with android:panelBackground item in the theme:
<style name="Theme.settleup" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="android:panelBackground">#drawable/mybackground</item>
</style>
Since it seems to be a problem to change the text color for bottom options menu on Android >= 4.0 HW key devices, I would suggest to leave this part to its default styling.
Been digging in the AppCompat theming but whatever I tried the textColor remains white. What I do now is just popup the Toolbar menu manually like this:
#Override
public boolean onKeyUp(int keycode, KeyEvent e) {
switch (keycode) {
case KeyEvent.KEYCODE_MENU:
if ( getSupportActionBar() != null ) {
getSupportActionBar().openOptionsMenu();
return true;
}
}
return super.onKeyUp(keycode, e);
}
Pressing the menu button while the menu is open magically closes it.
Who needs the ugly black bottom aligned menu anyway?
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
<style name="AppTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:dropDownListViewStyle">#style/PopupMenuListView</item>
<item name="android:actionBarWidgetTheme">#style/PopupMenuTextView</item>
<item name="android:popupMenuStyle">#style/PopupMenu</item>
<item name="android:listPreferredItemHeightSmall">40dp</item>
</style>
<!-- Change Overflow Menu ListView Divider Property -->
<style name="PopupMenuListView" parent="#android:style/Widget.Holo.ListView.DropDown">
<item name="android:divider">#color/app_navigation_divider</item>
<item name="android:dividerHeight">1sp</item>
<item name="android:listSelector">#drawable/list_selector</item>
</style>
<!-- Change Overflow Menu ListView Text Size and Text Size -->
<style name="PopupMenuTextView" parent="#android:style/Widget.Holo.Light.TextView">
<item name="android:textColor">#color/app_white</item>
<item name="android:textStyle">normal</item>
<item name="android:textSize">18sp</item>
<item name="android:drawablePadding">25dp</item>
<item name="android:drawableRight">#drawable/navigation_arrow_selector</item>
</style>
<!-- Change Overflow Menu Background -->
<style name="PopupMenu" parent="android:Widget.Holo.Light.ListPopupWindow">
<item name="android:popupBackground">#drawable/menu_overflow_bg</item>
</style>
For AppCompat theme:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="actionBarPopupTheme">#style/HardwareOptionMenu</item>
</style>
<style name="HardwareOptionMenu" parent="ThemeOverlay.AppCompat.Dark">
<item name="android:textColorSecondary">#color/white</item>
<item name="android:colorBackground">#color/black</item>
</style>
try also adding the items without android prefix
<style name="Theme.settleup" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="android:popupMenuStyle">#style/settleup_PopupMenu</item>
<item name="popupMenuStyle">#style/settleup_PopupMenu</item>
<item name="android:actionMenuTextColor">#android:color/white</item>
<item name="actionMenuTextColor">#android:color/white</item>
</style>
<style name="settleup_PopupMenu" parent="#style/Widget.Sherlock.ListPopupWindow">
<item name="android:popupBackground">#drawable/menu_dropdown_panel_settleup</item>
<item name="popupBackground">#drawable/menu_dropdown_panel_settleup</item>
</style>
what you can do if you really have to change the text color of the menu from the right picture could be the following "hack":
SpannableStringBuilder text = new SpannableStringBuilder();
text.append("MenuItem1");
text.setSpan(new ForegroundColorSpan(Color.WHITE), 0, text.length(),
Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
menu.add(Menu.NONE, MENU_ITEM_1, Menu.NONE, null).setTitle(text);
I agree it's not the cleanest way (I would say it's quite ugly because you have to pay attention in each activity where you have such a menu and the title of each menu item needs to be changed using this logic) but it's something that displays the expected result.
Let me know if it helped you.
Cheers!
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.
I've been trying for a while to style the items in a drop down list I added to the Action Bar, but I can't come up with the right code.
I tried looking into the abs__styles.xml and abs__themes.xml in the SherlockActionBar project but none of the items I added to my project worked.
The way I'm creating the menus is the following:
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Sharing icons
SubMenu submenu = menu.addSubMenu(null);
submenu.add(getResources().getString(R.string.twitter));
submenu.add(getResources().getString(R.string.facebook));
submenu.add(getResources().getString(R.string.email));
// Share button itself
MenuItem ShareButton = submenu.getItem();
ShareButton.setIcon(R.drawable.icon_share_triangle);
ShareButton.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS | MenuItem.SHOW_AS_ACTION_WITH_TEXT);
// Twitter submenu button
MenuItem TwitterItem = submenu.getItem(0);
TwitterItem.setShowAsAction(MenuItem.SHOW_AS_ACTION_ALWAYS | MenuItem.SHOW_AS_ACTION_WITH_TEXT);
TwitterItem.setOnMenuItemClickListener(new OnMenuItemClickListener() {
public boolean onMenuItemClick(MenuItem item) {
setShareTwitterIntent();
return true;
}
});
...
}
I also tried taking a look at this post using the following code, but still no luck:
<!-- style the list navigation -->
<style name="MyDropDownNav" parent="android:style/Widget.Holo.Light.Spinner.DropDown.ActionBar">
<item name="android:background">#drawable/ad_spinner_background_holo_light</item>
<item name="android:popupBackground">#drawable/ad_menu_dropdown_panel_holo_light</item>
<item name="android:dropDownSelector">#drawable/ad_selectable_background</item>
</style>
I just need to change the background color of the items in the drop down list.
Thanks a lot for your help!
EDIT:
I also tried this, and it still doesn't work:
<item name="android:actionDropDownStyle">#style/MyApp.DropDownNav</item>
<item name="actionDropDownStyle">#style/MyApp.DropDownNav</item>
...
<style name="MyApp.DropDownNav" parent="Widget.Sherlock.Light.Spinner.DropDown.ActionBar">
<item name="android:background">#drawable/sharing_panel</item>
</style>
I had the same problem and after a lot of head scratching - the sort of scratching like a dog with a bad case of fleas - I got it to work. This is with ABS 4.1 (90). The below code will change the background colour of the drop down item.
SomeActivity.java
Context context = ab.getThemedContext();
ArrayAdapter<CharSequence> list = ArrayAdapter.createFromResource(
context, R.array.map_activity_view_list,
R.layout.sherlock_spinner_item);
list.setDropDownViewResource(R.layout.sherlock_spinner_dropdown_item);
Note: You use R.layout.sherlock_spinner_item for the createFromResource and R.layout.sherlock_spinner_dropdown_item for the setDropDownViewResource.
This is what appears in the sample in the ABS source:
https://github.com/JakeWharton/ActionBarSherlock/blob/master/samples/demos/src/com/actionbarsherlock/sample/demos/ListNavigation.java
This is because the unselected dropdown in the action bar when is the sherlock_spinner_item layout and the actual dropdown items use the sherlock_spinner_dropdown_item layout which means the styles are different for each:
sherlock_spinner_item
android:spinnerItemStyle
spinnerItemStyle
sherlock_spinner_dropdown_item
android:spinnerDropDownItemStyle
spinnerDropDownItemStyle
Remember both styles are needed - android: prefixed styles for for the native ICS ActionBar and the style without the android: prefix is for the AcrionBarSherlock style on devices older than ICS.
res/values/styles.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Theme.MyApp" parent="Theme.Sherlock.Light">
<!-- the text when loading -->
<!--
<item name="actionBarStyle">#style/Widget.MyApp.ActionBar</item>
<item name="android:actionBarStyle">#style/Widget.MyApp.ActionBar</item>
-->
<!-- the dropdown items -->
<item name="android:spinnerDropDownItemStyle">#style/MyApp.Widget.Holo.DropDownItem</item>
<item name="spinnerDropDownItemStyle">#style/MyApp.Widget.Holo.DropDownItem</item>
<!-- the action bar dropdown menu item -->
<!--
<item name="android:spinnerItemStyle">#style/MyApp.Widget.Holo.SpinnerItem</item>
<item name="spinnerItemStyle">#style/MyApp.Widget.Holo.SpinnerItem</item>
-->
</style>
<style name="Widget.MyApp.ActionBar" parent="Widget.Sherlock.Light.ActionBar">
<item name="titleTextStyle">#style/Widget.MyApp.TitleTextStyle</item>
<item name="android:titleTextStyle">#style/Widget.MyApp.TitleTextStyle</item>
</style>
<style name="Widget.MyApp.TitleTextStyle" parent="TextAppearance.Sherlock.Widget.ActionBar.Title">
<item name="android:textColor">#color/orange</item>
</style>
<style name="MyApp.Widget.Holo.DropDownItem" parent="Widget.Sherlock.Light.DropDownItem.Spinner">
<item name="android:background">#color/orange</item>
</style>
<style name="MyApp.Widget.Holo.SpinnerItem" parent="Widget.Sherlock.TextView.SpinnerItem">
<item name="android:background">#color/orange</item>
</style>
</resources>
res/values/color.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="orange">#ffEf4f1f</color>
</resources>
Please mark as answer if this solves it for you. Thanks!
Links:
Browse styles:
https://github.com/JakeWharton/ActionBarSherlock/blob/master/actionbarsherlock/res/values/abs__styles.xml
Browse themes:
https://github.com/JakeWharton/ActionBarSherlock/blob/master/actionbarsherlock/res/values/abs__themes.xml
To change the background drawable of the menu item in Sherlock Action Bar (v4.1.0), use the following:
<style name="My_Theme" parent="Theme.Sherlock">
<item name="android:popupMenuStyle">#style/MyApp.PopupMenuStyle</item>
<item name="popupMenuStyle">#style/MyApp.PopupMenuStyle</item>
</style>
<style name="MyApp.PopupMenuStyle" parent="Widget.Sherlock.ListPopupWindow">
<item name="android:popupBackground">#drawable/menu_item_background</item>
</style>
hope this helps.
i used this, and its work for me
<style name="MyDropDownItem" parent="Widget.Sherlock.Spinner.DropDown.ActionBar">
<item name="android:background">#drawable/spinner_background_holo_light</item>
<item name="android:popupBackground">#color/actionbar_normal</item>
<item name="android:dropDownSelector">#drawable/list_selector_holo_light</item>
</style>
<style name="myTheme" parent="#style/Theme.Sherlock">
...
...
...
<item name="android:actionDropDownStyle">#style/MyDropDownItem</item>
<item name="actionDropDownStyle">#style/MyDropDownItem</item>
</style>
where,
"spinner_background_holo_light" and "list_selector_holo_light" are selectors
and
"actionbar_normal" drawable (image OR color)
I am not sure if this question has been answered in a satisfactory way, but I ran into this problem and did not find an answer that I liked. It seemed like I had a pretty standard configuration of ActionBarSherLock and using the drop down navigation gave me some bad results out of the box. Black text on a black background. I want to make the text white. Here is how I accomplished it:
For starters, my application's base theme extends Theme.Sherlock:
<style name="AppBaseTheme" parent="Theme.Sherlock">
</style>
My actual application theme AppTheme extends my base (I can't remember why I did this at the time, it is likely unnecessary).
<style name="AppTheme" parent="AppBaseTheme">
<item name="spinnerItemStyle">#style/SpinnerItemStyle</item>
<item name="android:spinnerItemStyle">#style/SpinnerItemStyle</item>
</style>
I needed to override Widget.Sherlock.TextView.SpinnerItem and so as below:
<style name="SpinnerItemStyle" parent="Widget.Sherlock.TextView.SpinnerItem">
<item name="android:textAppearance">#style/TextAppearance.MySpinnerItem</item>
</style>
The reason for doing this was to access the TextApperance widget: TextAppearance.Sherlock.Widget.TextView.SpinnerItem
This was overridden as below:
<style name="TextAppearance.MySpinnerItem" parent="TextAppearance.Sherlock.Widget.TextView.SpinnerItem">
<item name="android:textColor">#FFFFFF</item>
<item name="android:textSize">16sp</item>
<item name="android:textStyle">normal</item>
</style>
My biggest mistake in tying to get the text in trying to fix this was trying to directly set textColor in the overridden SpinnerItemStyle. Since it used a textAppearance widget, it was just not working.
Then my code to make this work looks like this (in my activity's onCreate method):
SpinnerAdapter spinnerAdapter = ArrayAdapter.createFromResource(this,
R.array.call_type, R.layout.sherlock_spinner_item);
OnNavigationListener onNavigationListener = new OnNavigationListener() {
// Get the same strings provided for the drop-down's ArrayAdapter
String[] strings = getResources().getStringArray(R.array.call_type);
#Override
public boolean onNavigationItemSelected(int position, long itemId) {
String filter = strings[position];
filterCalls(filter);
return true;
}
};
ActionBar actionBar = getSupportActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_LIST);
actionBar.setListNavigationCallbacks(spinnerAdapter,
onNavigationListener);
This allowed my to change the color of the text, on the spinner drop down using ActionBarSherlock.
ActionBarSherlock requires you to use one of its 3 themes. You can extend them though, and override the dropdown style, like this:
<style name="MySherlockLightTheme" parent="Theme.Sherlock.Light">
<item name="actionDropDownStyle">#style/MyDropDownNav</item>
</style>
This is assuming you want the holo light theme, and your dropdown style is MyDropDownDav.
Then in your code, you just switch to use your theme (either in the manifest, or do it in Activity's onCreate).