Develop Reference

Wrong colors on pre-lollipop devices with AppCompatTheme

I have this in my style.xml file
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light">
<!-- Customize your theme here. -->
<!--<item name="colorPrimary">#color/colorPrimary</item>-->
<!--<item name="colorAccent">#color/colorAccent</item>-->
<item name="android:windowBackground">#color/white</item>
<item name="android:windowTranslucentStatus">true</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="LoginScreenTheme" parent="AppTheme">
<item name="android:textColor">#color/white</item>
<item name="colorAccent">#color/white</item>
<item name="colorPrimaryDark">#color/login_background_dark</item>
</style>
<style name="LoginEditTextTheme" parent="AppTheme">
<item name="colorControlNormal">#color/login_edit_text_hint_color</item>
<item name="colorControlActivated">#color/login_edit_text_accent</item>
<item name="colorControlHighlight">#color/login_edit_text_accent</item>
<item name="android:textColorHint">#color/login_edit_text_hint_color</item>
<item name="android:textColorPrimary">#color/white</item>
</style>
<style name="LoginErrorFloatingLabelTheme" parent="TextAppearance.AppCompat.Small">
<item name="android:textColor">#color/login_error_floating_label_color</item>
</style>
<style name="ActionBarTheme" parent="AppTheme">
<item name="android:background">#color/home_primary_color</item>
</style>
<style name="LoginWaitingProgressBar" parent="AppTheme">
<item name="colorAccent">#color/orange_light</item>
</style>
</resources>
On devices with Lollipop and upper everything is alright, but on pre-lollipop there are wrong colors. It's look like theme is not applied to the devices with pre-lollipop android version. After googling I found that people are adviced to remove 'android:' prefix before every item in AppCompat theme but it doesn't work for me coz android studio doesn't see items after that.

The reason was that I didn't extend AppCompatActivity. When I changed it everything became okay.

colorPrimary , colorPrimaryDark and colorAccent items are available on only API 21+.If you want to apply them on pre lollipop devices you must move your current styles.xml file to values-v21 and create a new styles.xml on values folder and use the correct item for pre lollipop.
Check out android developers for more https://developer.android.com/guide/topics/ui/themes.html

Is there a way to style PreferenceFragmentCompat

The title says it all: how can I style my PreferenceFragmentCompat. My v14/style.xml is
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="AppBaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:editTextStyle">#style/Widget.EditText.White</item>
<item name="preferenceTheme">#style/PreferenceThemeOverlay</item>
</style>
<style name="Widget.EditText.White" parent="#android:style/Widget.EditText">
<item name="android:textColor">#ffffffff</item>
</style>
</resources>
The base theme has a black background - the preferences screen is then unreadable as I have black text on that black background.
I've tried many things but I cannot change the text colour.
What I've had to do is to set the fragment container background colour to white whilst the settings fragment is active. An ugly hack and not what I want to have to do.

To answer my own question: my v14/style.xml is now
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="AppBaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:editTextStyle">#style/Widget.EditText.White</item>
<item name="preferenceTheme">#style/PreferenceThemeOverlay.v14.Material</item>
</style>
<style name="Widget.EditText.White" parent="#android:style/Widget.EditText">
<item name="android:textColor">#ffffffff</item>
</style>
<style name="PreferenceThemeOverlay.v14">
<item name="android:background">#color/settings_background</item>
<item name="android:textColor">#color/settings_text_colour</item>
<item name="android:textColorSecondary">#color/settings_text_colour_secondary</item>
</style>
</resources>
My problem is now to style a ListPreference.
Why is this so hard? If there is any documentation relating to styling preferences, it is well hidden. Grrrrrr!

Take a look at README for github project
Gericop/Android-Support-Preference-V7-Fix

Widget.AppCompat.Button colorButtonNormal shows gray

I have values:styles.xml with:
<style name="AppTheme.Button" parent="Base.Widget.AppCompat.Button">
<item name="colorButtonNormal">#color/my_color</item>
<item name="android:textColor">#android:color/white</item>
</style>
and values-v21:styles.xml with:
<style name="AppTheme.Button" parent="Base.Widget.AppCompat.Button">
<item name="android:colorButtonNormal">#color/my_color</item>
<item name="android:textColor">#android:color/white</item>
</style>
And app style with
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:buttonStyle">#style/AppTheme.Button</item>
</style>
But the colors appears grey instead of #color/my_color

To customize one Button only set android:theme="#style/AppTheme.Button" to your Button.
<Button
android:theme="#style/AppTheme.Button"
/>
Define your style as you did in your question
<style name="AppTheme.Button" parent="Base.Widget.AppCompat.Button">
<item name="colorButtonNormal">#color/my_color</item>
</style>
[EDIT]
See GitHub demo here

Use Widget.AppCompat.Button.Colored as a parent for your style.
<style name="RedButton" parent="Widget.AppCompat.Button.Colored">
<item name="android:textColor">#color/white</item>
<item name="colorButtonNormal">#color/red</item>
</style>
Use android:theme, not style in buttons definitions:
<Button android:theme="#style/RedButton"/>
See AppCompat v21 > Theming and Android Support Library v22.1 - AppCompat blog posts.
(note on second post, android:theme is supported on API11-, it just doesn't do automatic inheritance from parent, you will have to specify it on each child, not an issue here but worth mentioning - see Chris Banes' post on that).

Put the xml line below in your "AppTheme" xml, rather than trying to set it from the "AppTheme.Button". This works for me on v22.1.1 with non-lollipop devices. I'm guessing this is a bug because your solution above works fine for lollipop.
<item name="colorButtonNormal">#color/my_color</item>

Ensure your Activity is extending AppCompatActivity, otherwise it won't handle appCompat styles properly.
class: android.support.v7.app.AppCompatActivity
Gradle: compile 'com.android.support:appcompat-v7:23.0.1'

Use:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="buttonStyle">#style/AppTheme.Button</item>
</style>
remove the android:

That works:
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<!-- android:buttonStyle for v21+ and buttonStyle for the rest -->
<item name="buttonStyle">#style/MyCustomButton</item>
<item name="android:buttonStyle">#style/MyCustomButton</item>
<item name="colorButtonNormal">#color/my_color</item>
</style>
<style name="MyCustomButton" parent="Base.Widget.AppCompat.Button">
<item name="android:textColor">#ffffff</item>
<item name="android:textAppearance">?android:attr/textAppearanceMedium</item>
</style>
colorButtonNormal can be set in the theme style. To change the text color, size or any other feature of the button you can create a style and then using buttonStyle (less than v21) or android:buttonStyle (v21+) in the the theme style to set the button style.

v21/styles.xml
<style name="AppTheme.BlueButton" parent="Widget.AppCompat.Button.Colored">
<item name="android:colorButtonNormal">#color/blue</item>
<item name="android:textColor">#color/text_white</item>
</style>
styles.xml
<style name="AppTheme.BlueButton" parent="Widget.AppCompat.Button.Colored">
<item name="colorButtonNormal">#color/blue_tint</item>
<item name="android:textColor">#color/text_white</item>
</style>
Initially I'm too facing this problem. After making correction like above I got correct UI button

It seems to be a bug on Android framework that we can not change customize colorButtonNormal with Widget.AppCompat.Button theme.
A workaround solution is to define another custom AppCompat theme and use colorAccent to set colorButtonNormal.
There are two following steps.
1.Define another theme for your custom button.
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<!-- Custom button theme. -->
<style name="CustomButtonTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Set your desired button color here. -->
<item name="colorAccent">#color/red</item>
<item name="buttonStyle">#style/Widget.AppCompat.Button.Colored</item>
</style>
</resources>
2.Apply button theme in layout.
<Button android:theme="#style/CustomButtonTheme"/>

Hi I think the parent widget you used might be not correct one, it should android:Widget.Button for API version 21 or earlier version, for later version 21 or above you should use `android:Widget.Material.Button. Let say you have default style should look see below.
res/values/styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:buttonStyle">#style/AppTheme.Button</item>
</style>
<style name="AppTheme.Button" parent="android:Widget.Button">
<item name="android:background">#color/my_color</item>
<item name="android:textColor">#android:color/white</item>
</style>
</resources>
For API version 21 the resource style file should look like (res/values-v21/style.xml)
<resources>
<style name="AppTheme.Button" parent="android:Widget.Material.Button">
<item name="android:background">#color/my_color</item>
<item name="android:textColor">#android:color/white</item>
</style>
</resources>
Thank you Let me know if you have any question.

In case you wonder why colorButtonNormal is not picked up as defined for disabled buttons, you might also need to set android:disabledAlpha to 1.0 in your theme, otherwise your color will by default blend into the button's background. Example:
<style name="MyButtonTheme" parent="ThemeOverlay.AppCompat.Light">
<item name="android:disabledAlpha">1.0</item>
<item name="colorButtonNormal">#color/my_solid_disabled_color</item>
<item name="colorAccent">#color/my_solid_accent_color</item>
<item name="buttonStyle">#style/my_button_style</item>
</style>

Try buttonStyle instead of android:buttonStyle, since this is AppCompat attribute pre Lollipop, so it should be without android prefix

Change Background color of the action bar using AppCompat

I found some questions about this problem around the web. Unfortunately, everything i try so far, has been unsuccessful.
Has the title say, i need to change the background color of my action bar.
The project have a min sdk of 9, and max sdk of 19.
I have create in my res/values folder, an xml file:
red_actionbar.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="CustomActionBarTheme" parent="#style/Theme.AppCompat.Light">
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<style name="MyActionBar"
parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="background">#color/red</item>
</style>
</resources>
the colors.xml stored in res/values
<resources>
<color name="red">#FF0000</color>
</resources>
and the part of the manifest where i change the theme
<application
android:allowBackup="true"
android:icon="#drawable/ic_launcher"
android:label="#string/app_name"
android:theme="#style/CustomActionBarTheme" >
But nothing changes. Where is the problem? The application accepts the code because if i change ths:
<style name="CustomActionBarTheme" parent="#style/Theme.AppCompat.Light">
to
<style name="CustomActionBarTheme" parent="#style/Theme.AppCompat.Light.DarkActionBar ">
it does change the theme of my app, so the problem is in the style but I don't know how to solve it.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="CustomActionBarTheme" parent="#style/Theme.AppCompat.Light">
<item name="android:actionBarStyle" tools:ignore="NewApi">#style/MyActionBar</item>
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<style name="MyActionBar"
parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="android:background" tools:ignore="NewApi">#color/red</item>
<item name="background">#color/red</item>
</style>
</resources>

<style name="MyActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="android:background" tools:ignore="NewApi">#color/red</item>
<item name="background">#color/red</item>
</style>
<style name="CustomActionBarTheme" parent="#style/Theme.AppCompat.Light">
<item name="android:actionBarStyle" tools:ignore="NewApi">#style/MyActionBar</item>
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
you need both android:background and background items. The former is for newer versions of android that support ActionBar natively. The latter is for older android versions.
EDIT
instead of <resources> use
<resources xmlns:tools="http://schemas.android.com/tools" xmlns:android="http://schemas.android.com/apk/res/android">
From SDK 21
to change Action Bar background color, add this to ActionBarTheme, and the two colours are to be different or it will not work (thanks to #Dre and #lagoman)
<item name="colorPrimary">#color/my_awesome_red</item>
<item name="colorPrimaryDark">#color/my_awesome_darker_red</item>

Try this:
<style name="CustomActionBarTheme" parent="#style/Theme.AppCompat.Light">
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<style name="MyActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="android:background">#color/red</item>
<item name="background">#color/red</item>
</style>

Try this.
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
<item name="colorPrimary"> #6699FF </item>
</style>
You can change #6699FF color according to your choice (or use a color resource).

try to use
parent="Theme.AppCompat.Light"
instead of
parent="#style/Theme.AppCompat.Light"

How to change the background color of the action bar in Android?

I was working hard to achieve this but I had no luck. What I tried to do is to change the background color from the style that I attached in my main style tag. This is my code:
<resources>
<style name="AppBaseTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item ></item>
</style>
<style name="MyActionBar" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">#2E495E</item>
</style>
Still nothing changed.
I get this in my application:
http://i.imgur.com/m1MrGwk.png

I had the same issue and it's probably the same problem you were having. Notice the docs say the following:
each style property that you declare must be declared twice..
So my issue was I declared it for 2.1 and up, but not for 3.0 and greater so my Galaxy S4 of course could not see any changes to the colours I was making.
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="android:actionBarStyle">#style/MyActionBar</item>
<!--Support Library compatibility-->
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<!-- ActionBar styles -->
<style name="MyActionBar"
parent="#style/Widget.AppCompat.Light.ActionBar">
<item name="android:background">#color/green</item>
<!--Support Library compatibility-->
<item name="background">#color/green</item>
</style>
<style name="NoActionBar" parent="Theme.AppCompat.Light">
<item name="android:windowNoTitle">true</item>
</style>

Is this the only style.xml you have? Else check if you are modifying
for the right API