Android default button color

Question

When I open a new android studio project, the default color for button is purple. I want the default color to be the gray default button color(I assume you know what I mean). I tried to change the color via xml and java and nothing worked. I want that the default button color will be gray without I'd have to change it every time.

themse.xml:

<resources xmlns:tools="http://schemas.android.com/tools">
<!-- Base application theme. -->
<style name="Theme.HangmanGame" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
    <!-- Primary brand color. -->
    <item name="colorPrimary">@color/purple_500</item>
    <item name="colorPrimaryVariant">@color/purple_700</item>
    <item name="colorOnPrimary">@color/white</item>
    <!-- Secondary brand color. -->
    <item name="colorSecondary">@color/teal_200</item>
    <item name="colorSecondaryVariant">@color/teal_700</item>
    <item name="colorOnSecondary">@color/black</item>
    <!-- Status bar color. -->
    <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
    <!-- Customize your theme here. -->
</style>

themes.xml(night)

<resources xmlns:tools="http://schemas.android.com/tools">
<!-- Base application theme. -->
<style name="Theme.HangmanGame" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
    <!-- Primary brand color. -->
    <item name="colorPrimary">@color/purple_200</item>
    <item name="colorPrimaryVariant">@color/purple_700</item>
    <item name="colorOnPrimary">@color/black</item>
    <!-- Secondary brand color. -->
    <item name="colorSecondary">@color/teal_200</item>
    <item name="colorSecondaryVariant">@color/teal_200</item>
    <item name="colorOnSecondary">@color/black</item>
    <!-- Status bar color. -->
    <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
    <!-- Customize your theme here. -->
</style>

Metempirics

Are you using the material components library? – Huai

No, The button color is purple by default – Metempirics

Post your app theme – Huai

your colorPrimary and colorPrimaryVariant is set to purple. changing these to a grey color is not working? – Transformer

What is the hex value of default button color? – Metempirics

@Metempirics You are using a MaterialComponents theme. Check the answer below. The background color of the button is based on <item name="colorPrimary">@color/purple_500</item>. – Huai

Answer 1

Since you are using a Theme.MaterialComponents.* theme the default background color of the Button (which is replaced by a MaterialButton) is the colorPrimary defined in your app theme.
In your case:

<item name="colorPrimary">@color/purple_500</item>

You can change this value (but this will affect all widgets).

If you want to change globally the button style in your app you can also add the materialButtonStyle attribute in your app theme:

<style name="Theme.HangmanGame" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
   <item name="materialButtonStyle">@style/Widget.App.Button</item>
</style>

with:

<style name="Widget.App.Button" parent="Widget.MaterialComponents.Button">
    <item name="backgroundTint">@color/...</item>
</style>

If you want to change this color only in the button you can use also the app:backgroundTint attribute removing the android:background attribute:

<Button
    app:backgroundTint="@color/..."/>

If you want to use a custom background using the android:background attribute you have to add app:backgroundTint="@null" to avoid that the button is tinted.

Huai

It works material3 api 31. – Sterilize

Answer 2

I think the easiest way is to go into three xml files: src\main\res\values\colors.xml, src\main\res\values\themes.xml, and src\main\res\values-night\themes.xml

In the colors.xml, add a color and call it "button", then set the color to what you want. For a simple list of color codes, see this answer: https://mcmap.net/q/48554/-web-colors-in-an-android-color-xml-resource-file

The line would look something like this:

<color name="button">#808080</color>  //That code is the gray you want.

In the two themes files, change colorPrimary to "@color/button"

This will affect every button in the app.

Drawl

Answer 3

Either, you can change the application theme in themes.xml from:

<style name="Theme.DemoApp" parent="Theme.MaterialComponents.DayNight.DarkActionBar">

to this:

    <style name="Theme.DemoApp" parent="Theme.AppCompat.DayNight.DarkActionBar">

Then, add Button Background:

<Button
        android:id="@+id/button"
        android:layout_width="120dp"
        android:layout_height="wrap_content"
        **android:background="@color/white"**
        android:text="Submit"/>

Marlow