Android styling action bar overflow menu? - android

I am trying to style the overflow menu items on the action bar but so far I've had no luck. I am testing on Android API 21 but my minimum version is set to 17. I am using the theme DeviceDefault. I tried setting the theme to Holo but the action bar disappears completely then. Anyways, here are the styles I'm currently using for the action bar:
<style name="AppBaseTheme" parent="android:Theme.DeviceDefault">
<item name="android:popupMenuStyle">#style/PopupMenu</item>
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="actionBarStyle">#style/MyActionBar</item>
<item name="android:displayOptions">showHome|useLogo|showTitle</item>
</style>
<style name="AppTheme" parent="AppBaseTheme">
</style>
<style name="MyActionBar">
<item name="android:background">#drawable/gradient3</item>
<item name="android:titleTextStyle">#style/MyActionBarTitleText</item>
<item name="titleTextStyle">#style/MyActionBarTitleText</item>
</style>
<style name="PopupMenu" parent="android:Widget.DeviceDefault.ListPopupWindow">
<item name="android:popupBackground">#drawable/gradient1</item>
<item name="android:textColor">#color/ed</item>
</style>
<style name="MyActionBarTitleText" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">#color/ed</item>
<item name="android:textSize">18sp</item>
</style>
So far popupMenuStyle seems to be ignored on API 21 but the action bar background takes effect. What is the correct way of styling the overflow menu for android versions 17 onwards? Also, is it recommended to use DeviceDefault as the theme and if not, is there a reason the Holo theme is making the action bar disappear?
Thank you. I appreciate any help.

Related

Android Action bar won't obey background color

I've just updated my project to target API 22, and my action bar style appears to have broken. Despite setting the background to white, and the color to blue, I end up with a black action bar with white text.
Here's my application theme.
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="android:homeAsUpIndicator">#drawable/up_button</item>
<item name="android:actionMenuTextAppearance">#style/H4.Other</item>
<item name="android:actionMenuTextColor">#color/h4_other</item>
<item name="android:windowContentOverlay">#drawable/header_shadow</item>
<item name="android:buttonStyle">#style/ButtonStyle.NoCaps</item>
</style>
Here's my action bar style.
<style name="MyActionBar" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:title">""</item>
<item name="android:background">#color/white</item>
<item name="android:height">#dimen/action_bar_height</item>
<item name="android:titleTextStyle">#style/H5.Blue</item>
</style>
Ok I figured this out. When you've updated the version of the app compat library you're using, the namespacing of some attributes needs to change. In my case it was changing from android:background to just background, among other things.

Change Android 5.0 Actionbar color

I'm working with the new Lollipop Material Design guidelines and would like to incorporate that nifty navigation drawer animation in my app. I've gotten that far, by using the android.support.v7.app.ActionBarDrawerToggle, but now I'm having difficulty changing the color of said action bar. It stays bright gray no matter what I set the theme to. How would one go about changing the color of the actionbar? This is what my app theme looks like:
//res/values/styles.xml
<style name="AppTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/ActionBar</item>
<item name="android:colorPrimary">#color/primaryDef</item>
<item name="android:colorPrimaryDark">#color/primaryDarkDef</item>
<item name="android:activatedBackgroundIndicator">#drawable/defbg</item>
<item name="android:colorAccent">#color/primaryDef</item>
<item name="android:navigationBarColor">#color/primaryDarkDef</item>
</style>
<style name="ActionBar" parent="android:Widget.ActionBar">
<item name="android:background">#color/primaryDef</item>
</style>
AppCompat does not use the android: prefixed attributes for the Material Theme color palette items per the migration guide to v21 by the author of AppCompat. Instead, just use the names themselves:
<style name="AppTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/primaryDef</item>
<item name="colorPrimaryDark">#color/primaryDarkDef</item>
<item name="colorAccent">#color/primaryDef</item>
<item name="android:navigationBarColor">#color/primaryDarkDef</item>
<item name="android:activatedBackgroundIndicator">#drawable/defbg</item>
</style>
The Action Bar will be colored by colorPrimary.

Styling action bar tabs background with AppCompat

I am trying to style background for action bar for versions 2.2 >=. I want to have dark red on title bar and lighter red on tabs. I have similar file placed in values-v11 and values-v14 accordingly. It works as intended on ICS and Kitkat I tested. On 2.x, the color on backgroundStacked appears on both the title bar and tabs.
Why is this happening? I don't want to use Android Asset Studio because I don't want to add extra images if it is possible without.
res/values/styles.xml
<style name="MyAppTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar">
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<style name="MyActionBar" parent="#style/Widget.AppCompat.ActionBar.Solid">
<item name="background">#color/dark_red</item>
<item name="backgroundStacked">#color/lighter_red</item>
<item name="titleTextStyle">#style/MyActionBarTabText</item>
</style>
<style name="MyActionBarTabText" parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">#color/white</item>
</style>

ActionBarDisappearing on Android 4.0+

I am currently writing an application for devices on 2.3 - 4.2+ and am having some weird, and unexpected issues. It was working fine until and displaying on all devices before I attempted to theme it. Even with a simple style simply extending the action bar sherlock theme, there appears to be no action bar showing.
The setup for the styles.
<style name="FrameworkRoot.Theme" parent="Theme.Sherlock.Light.DarkActionBar">
<!-- API 11+ (compatibility) -->
<item name="buttonBarStyle">#style/Compat.ButtonBar</item>
<item name="buttonBarButtonStyle">#style/Compat.ButtonBarButton</item>
<item name="indeterminateProgressStyle">#style/Compat.IndeterminateProgress</item>
<!-- API 14+ (compatibility) -->
<item name="listPreferredItemPaddingLeft">#dimen/compat_list_preferred_item_padding_left</item>
<item name="listPreferredItemPaddingRight">#dimen/compat_list_preferred_item_padding_right</item>
<item name="listPreferredItemHeightSmall">#dimen/compat_list_preferred_item_height_small</item>
</style>
<style name="Theme.Base" parent="FrameworkRoot.Theme">
<item name="textHeaderMaxLines">#integer/text_header_max_lines</item>
<item name="trackAbstractMaxLines">#integer/track_abstract_max_lines</item>
<item name="activatableItemBackground">#drawable/activatable_item_background</item>
</style>
<!-- Base themes for the app -->
<style name="Theme.TestApp" parent="Theme.Base">
<item name="actionBarStyle">#style/Widget.TestApp.ActionBar</item>
<item name="android:actionBarStyle">#style/Widget.TestApp.ActionBar</item>
</style>
<!-- Base Action Bar Style -->
<style name="Widget.TestApp.ActionBar" parent="Theme.Sherlock.Light.DarkActionBar">
</style>
If I remove the:
<item name="android:actionBarStyle">#style/Widget.TestApp.ActionBar</item>
So that the action bar itself it not getting styled in 3.0+, I can't style the bar.
What would be the best way to set this up? AndroidManifest.xml is pointing the app's style at "Theme.TestApp".
My end goal is to have a custom background on the action bar, as well as custom tab selector colors and fonts. What would be the best way to go about this, as my current method isn't working well.
You have to set an attribute for ActionBarSherlock and the native ActionBar. So replace this for example:
<style name="Theme.Base" parent="FrameworkRoot.Theme">
<item name="textHeaderMaxLines">#integer/text_header_max_lines</item>
<item name="trackAbstractMaxLines">#integer/track_abstract_max_lines</item>
<item name="activatableItemBackground">#drawable/activatable_item_background</item>
</style>
With this:
<style name="Theme.Base" parent="FrameworkRoot.Theme">
<item name="textHeaderMaxLines">#integer/text_header_max_lines</item>
<item name="trackAbstractMaxLines">#integer/track_abstract_max_lines</item>
<item name="activatableItemBackground">#drawable/activatable_item_background</item>
<item name="android:textHeaderMaxLines">#integer/text_header_max_lines</item>
<item name="android:trackAbstractMaxLines">#integer/track_abstract_max_lines</item>
<item name="android:activatableItemBackground">#drawable/activatable_item_background</item>
</style>
The attributes with the 'android' prefix point to the internal resources for the native ActionBar, the attributes without the 'android' in front point to the resources of the ActionBarSherlock.

Customize android action bar

I'm trying to create a new theme and customize the action bar:
<resources>
<style name="Theme.Shappy.Red" parent="Theme.Sherlock.Light">
<item name="android:actionBarStyle">#style/ActionBar.Shappy.Red</item>
...
... [some_other_customizations]
</style>
<!-- Action bar -->
<style name="ActionBar.Shappy.Red" parent="#style/Widget.Sherlock.Light.ActionBar.Solid">
<item name="android:background">#ffb70000</item>
<item name="android:titleTextStyle">#style/ActionBar.Title.Shappy.Red</item>
</style>
<!-- Action bar text -->
<style name="ActionBar.Title.Shappy.Red" parent="#style/TextAppearance.Sherlock.Widget.ActionBar.Title">
<item name="android:textColor">#ddffffff</item>
</style>
</resources>
As you can see, I'm using Sherlock. This code works fine for API level 14, but it doesn't work for API level 10. I still see the Holo light like action bar.
I think the code is correct because [some_other_customizations] are applied correctly.
Do you have any suggestion? Thanks.
<item name="android:actionBarStyle">#style/ActionBar.Shappy.Red</item>
and everything else with "android:" infront of it applies to the default actionbar. You have to put this in your styles as well:
<item name="actionBarStyle">#style/ActionBar.Shappy.Red</item>
This overrides the styles of the ABS.
So your Styles should look like this in order to work in API Levels 13<:
<style name="Theme.Shappy.Red" parent="Theme.Sherlock.Light">
<item name="android:actionBarStyle">#style/ActionBar.Shappy.Red</item>
<item name="actionBarStyle">#style/ActionBar.Shappy.Red</item>
</style>
<!-- Action bar -->
<style name="ActionBar.Shappy.Red" parent="#style/Widget.Sherlock.Light.ActionBar.Solid">
<item name="android:background">#ffb70000</item>
<item name="background">#ffb70000</item>
<item name="android:titleTextStyle">#style/ActionBar.Title.Shappy.Red</item>
<item name="titleTextStyle">#style/ActionBar.Title.Shappy.Red</item>
</style>
<!-- Action bar text -->
<style name="ActionBar.Title.Shappy.Red" parent="#style/TextAppearance.Sherlock.Widget.ActionBar.Title">
<item name="android:textColor">#ddffffff</item>
<item name="textColor">#ddffffff</item>
</style>

Categories

Resources