I styled my actionbar like so, which results in a normal spinner and not an action bar spinner (without the line on the bottom). But I do want it to be white and prefer to not user my own drawables for this and use the android's spinner style. (See below what the result is).
<style name="AppTheme" parent="#style/Theme.AppCompat.Light">
<item name="android:actionOverflowButtonStyle">#style/AppTheme.OverFlow</item>
<item name="android:actionDropDownStyle">#style/AppTheme.actionBarDropDown</item>
<item name="android:spinnerDropDownItemStyle">#style/DropDownList</item>
<item name="android:actionBarSize">48dp</item>
<item name="actionBarSize">48dp</item>
</style>
<style name="AppTheme.actionBarDropDown" parent="android:style/Widget.Holo.Spinner">
<!--<item name="android:background">#android:style/ab</item>-->
</style>
<style name="DropDownList" parent="#android:style/Widget.Holo.Light.ListView.DropDown">
<!-- background of the list menu -->
<item name="background">#android:color/background_light</item>
<item name="android:background">#android:color/background_light</item>
<item name="android:popupBackground">#android:color/background_light</item>
<!-- dividers -->
<item name="android:divider">#color/border_color</item>
<item name="android:dividerHeight">1dip</item>
<!-- item selected -->
<!--<item name="android:dropDownSelector">#android:color/holo_blue_dark</item>-->
<!--<item name="android:listSelector">#android:color/holo_blue_dark</item>-->
</style>
as you see the line breaks my design of the title.
Does anyone know what I could change to use a normal actionbar spinner drawable?
I can't seem to find this anywhere on stack.
Check the comments of the question, it's based on resources which don't have a white arrow, it's grey and it's not for the actionbar. So the best option is to use the generator
Related
I was able to change the color setting for the clock view
(That was helpful https://www.tutorialsbuzz.com/2019/09/android-timepicker-dialog-styling.html)
But I wasn't so successful at the second view (press the keyboard icon at the bottom left of the first image). How to change the color of SubTitle, InputField and description (center of the image that looks pure black)? Has anyone an idea?
Is there a documentation that I overlook? Would be great to have a list with all keys like "android:numbersTextColor" etc. for the color pallet of the second view.
I appreciate your time and effort. Thanks :-)
Edit
"Leon Lu - MSFT" thanks for your answer. That made it possible to style the view under "Keyboard". Is it possible to set different colors for the text above and below the input field, the "AM"/"PM" text and "cancel"/"ok"?
Unfortunately the clock view changed into this after applying the provided style.
Complete Android Style
<style name="MainTheme" parent="MainTheme.Base">
</style>
<!-- Base theme applied no matter what API -->
<style name="MainTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<!--If you are using revision 22.1 please use just windowNoTitle. Without android:-->
<item name="windowNoTitle">true</item>
<!--We will be using the toolbar so no need to show ActionBar-->
<item name="windowActionBar">false</item>
<!-- Set theme colors from https://aka.ms/material-colors -->
<!-- colorPrimary is used for the default action bar background -->
<item name="colorPrimary">#2196F3</item>
<!-- colorPrimaryDark is used for the status bar -->
<item name="colorPrimaryDark">#1976D2</item>
<!-- colorAccent is used as the default value for colorControlActivated
which is used to tint widgets -->
<item name="colorAccent">#f59b00</item>
<!-- You can also set colorControlNormal, colorControlActivated
colorControlHighlight and colorSwitchThumbNormal. -->
<item name="windowActionModeOverlay">true</item>
<item name="android:datePickerDialogTheme">#style/AppCompatDialogStyle</item>
<item name="android:timePickerDialogTheme">#style/TimePickerLightTheme</item>
<item name="android:timePickerStyle">#style/TimePickerLightStyle</item>
<item name="android:textAllCaps">false</item>
</style>
<style name="AppCompatDialogStyle" parent="Theme.AppCompat.Light.Dialog">
<item name="colorAccent">#f59b00</item>
</style>
<style name="TimePickerLightTheme" parent="Theme.AppCompat.Light.Dialog">
<item name="android:background">#4b4b4b</item>
<item name="android:colorAccent">#2c2f30</item>
<item name="android:textColor">#f59b00</item>
<item name="android:textColorPrimary">#ffffff</item>
</style>
<style name="TimePickerLightStyle" parent="android:Widget.Material.Light.TimePicker">
<item name="android:headerBackground">#2c2f30</item>
<item name="android:numbersTextColor">#ffffff</item>
<item name="android:numbersInnerTextColor">#ffffff</item>
<item name="android:numbersSelectorColor">#f59b00</item>
<item name="android:numbersBackgroundColor">#4b4b4b</item>
<item name="android:background">#1f1f1f</item>
<item name="android:textColorPrimary">#a1a1a1</item>
</style>
Is there a list with keys for all elements that I'm overlooking? Would be great to have a list where it says something like "Key X is for color of view element Y".
Do you want to change the color of SubTitle, InputField and description like following screenshot?
Create the Theme.picker style.
<style name="Theme.picker" parent="Theme.AppCompat.Light.Dialog">
//background color
<item name="android:background">#FFC107</item>
//Title background color
<item name="colorAccent">#FF0000</item>
//text color
<item name="android:textColor">#android:color/white</item>
//edittext color
<item name="android:textColorPrimary">#android:color/holo_green_light</item>
</style>
Them use it in the Timepicker.
<TimePicker
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/Theme.picker"/>
If you used xamarin forms.You should add an item in <style name="MainTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:timePickerDialogTheme">#style/Theme.picker</item>
=====update======
Is it possible to set different colors for the text above and below the input field, the "AM"/"PM" text and "cancel"/"ok"?
If you want to set it, just change the color in the <item name="android:textColor">#android:color/red</item> tab. The textcolor of firstview and second view will be changed, it set both of them at the same time. If you want to set the diferent items for differen view, you should make a custom TimePicker
On android 7 (nexus phone) the title in my context menu appears white. I would expect it to be black as it is on all other devices I tested. The rest of the app looks good.
Update:
I figured out that the colorAccent is the culprit (AppCompat styles various things based on that). I set it to white in a child theme because the tabBar needs to have white tab indicators.
So now the issues is that I need white tab indicators in the actionbar, black titles in dialogs and context menus and Orange text on buttons styled with the Button.Borderless.Colored style. All of these seem to be controlled with colorAccent. I can make a seperate style for the buttons. But the styles of the dialogs and tab indicators are still conflicting. For legacy reasons I cannot use the new toolbar with a tablayout (That one is stylable) but have to use the Actionbar. Any ideas?
White title in context menu screenshot:
Thanks in advance!
Theme:
<resources>
<!-- default theme -->
<style name="Theme.MyApp" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Remove actionbar -->
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<!-- Basic coloring -->
<item name="colorPrimary">#color/MyAppOrange</item>
<item name="colorPrimaryDark">#color/MyAppOrangeDark</item>
<item name="colorAccent">#color/MyAppOrangeDark</item>
<!-- AppCompat dialog themes -->
<item name="dialogTheme">#style/Theme.MyApp.Dialog</item>
<item name="alertDialogTheme">#style/Theme.MyApp.Dialog.Alert</item>
///// Tried this with a custom style but that just f*cked up my tabs...
<item name="actionBarTabStyle">#style/CustomActionBarTabs</item>
</style>
<!-- Alert and dialog styles -->
<style name="Theme.MyApp.Dialog" parent="Theme.AppCompat.Light.Dialog">
<item name="colorPrimary">#color/MyAppOrange</item>
<item name="colorPrimaryDark">#color/MyAppOrangeDark</item>
<item name="colorAccent">#color/MyAppOrangeDark</item>
</style>
<style name="Theme.MyApp.Dialog.Alert" parent="Theme.AppCompat.Light.Dialog.Alert">
<item name="colorPrimary">#color/MyAppOrange</item>
<item name="colorPrimaryDark">#color/MyAppOrangeDark</item>
<item name="colorAccent">#color/MyAppOrangeDark</item>
</style>
</resources>
Djangow, you need to define a new style that with the text color as the specific color you want and then set that style in the app theme you want to use. See this link for the exact coding needed.
UPDATE: Djangow, I apologize. I looked into it and found that you have to add this line <item name="android:actionMenuTextColor">#color/your_color</item> to the main App theme. I found the answer here. Hope that helps
I would like to change the style (text and/or background colours) of the overflow area of the contextual action bar.
At present the text colour is taken from android:textColor in the current theme, but I want to use a different colour for the overflow dropdown.
I can change the background colour of the CAB using android:actionModeBackground, but not the overflow area.
My style currently looks like this:
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="windowActionModeOverlay">true</item>
<item name="android:textColor">#3e3e3e</item>
</style>
Any ideas?
Thank you
Use following item
<item name="actionOverflowMenuStyle">#style/LStyled.PopupMenu.OverflowMenu</item>
And define the style LStyled.PopupMenu.OverflowMenu
<style name="LStyled.PopupMenu.OverflowMenu" parent="#style/Widget.AppCompat.PopupMenu.Overflow">
<item name="android:popupBackground">#drawable/bground</item>
</style>
I have a custom theme that is (mostly) working great. The problem I have is that I cannot figure out a way to change the overflow menu's text color. I realize there are probably ways to do it programmatically but I'm really hoping I can find a solution I can put in the xml.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Theme.Light" parent="android:Theme.Material.Light.DarkActionBar">
<item name="themeName">Theme.Light</item>
<!--<item name="android:textColor">#ff000000</item>-->
<!-- colorPrimary is used for the default action bar background -->
<item name="android:colorPrimary">#color/blue</item>
<!-- colorPrimaryDark is used for the status bar -->
<item name="android:colorPrimaryDark">#color/medium_blue</item>
<!-- colorAccent is used as the default value for colorControlActivated,
which is used to tint widgets -->
<item name="android:colorAccent">#color/dark_blue</item>
<!-- You can also set colorControlNormal, colorControlActivated
colorControlHighlight, and colorSwitchThumbNormal. -->
<item name="android:actionOverflowMenuStyle">#style/Theme.Light.PopupMenu</item>
<item name="android:textColor">#color/light_text</item>
<item name="android:textColorPrimary">#color/light_text</item>
<item name="actionBarWidgetTheme">#style/MyStyle</item>
</style>
<style name="MyStyle" parent="android:style/Widget">
<item name="android:textColor">#color/dark_text</item>
</style>
<style name="Theme.Light.PopupMenu" parent="android:style/Widget.Material.PopupMenu.Overflow">
<!-- Required for pre-Lollipop. -->
<item name="overlapAnchor">false</item>
<!-- Required for Lollipop. -->
<item name="android:overlapAnchor">false</item>
<item name="android:popupBackground">#color/medium_blue</item>
<item name="android:actionMenuTextColor">#style/Theme.Light.TextAppearance</item>
<item name="android:textColor">#color/dark_text</item>
<item name="android:textColorPrimary">#color/dark_text</item>
</style>
<style name="Theme.Light.TextAppearance">
<item name="android:textColor">#color/dark_text</item>
<item name="android:textColorPrimary">#color/dark_text</item>
</style>
</resources>
I realize this is rather messy but I left in several ways I've attempted to change the textcolor. Basically instead of using the default black for the Material theme, I want to the change the overflow menu textcolor to white.
My guess is there's just some attribute I'm not changing but obviously I don't know what it is. I've searched Google and here but haven't found a solution to this.
EDIT: Setting the textColor for the entire theme does affect the overflow menu's text color but also affects every other text's color, obviously. I'm looking for a more specific attribute.
I'm trying to tweak my app with some custom colors but I cannot change the text color of the action bar.
This is how it is currently showing:
If you look close you might see letters in the white tab bar. I'm trying to change this color to black without changing anything else of the action bar.
This is how my styles.xml looks like:
<style name="AppTheme" parent="android:Theme.Holo.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/ActionBar</item>
</style>
<style name="ActionBar" parent="#android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
<item name="android:background">#color/default_green</item>
<item name="android:backgroundStacked">#color/stacked_white</item>
<item name="android:backgroundSplit">#color/sa_green</item>
</style>
Any help is appreciated.
You can make your custom theme here:
http://jgilfelt.github.io/android-actionbarstylegenerator/
Which includes all tabs and other component.
Try this ...
This should be in the theme
<item name="actionBarTabTextStyle">#style/tabtextcolor</item>
<item name="android:actionBarTabTextStyle">#style/tabtextcolor</item>
This should be where you define the tab text color.
<style name="tabtextcolor" parent="#style/Widget.Sherlock.ActionBar.TabText">
<item name="android:textColor">#android:color/white</item>
</style>