Button background color is not showing in my android activity

Question

I created a calculator activity as a part of a bigger app, and created a theme, and style for different components. yet, when I assign a background color of orange to the "buttonOperator" styles it doesn't show in the activity on the buttons that are using this style, appreciate explaining to me what i did wrong and maybe how/what tools can be used to troubleshoot such layout problems in android studio if such tools or methods are available.

below is the code relevant to the issue:

calculatorActivity.xml

<\?xml version="1.0" encoding="utf-8"?>
    <LinearLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/light_Black"
    android:orientation="vertical"
    android:theme="@style/Theme.UnitConverterAdvance.Calculator"
    tools:context=".CalculatorActivity">

    <LinearLayout style="@style/buttonRow">

        <Button
            style="@style/buttonNumber"
            android:text="@string/button_7" />

        <Button
            style="@style/buttonNumber"
            android:text="@string/button_8" />

        <Button
            style="@style/buttonNumber"
            android:text="@string/button_9" />

        <Button
            style="@style/buttonOperator"
            android:text="@string/button_division" />
    </LinearLayout>

    <LinearLayout style="@style/buttonRow">

        <Button
            style="@style/buttonNumber"
            android:text="@string/button_0" />

        <Button
            style="@style/buttonNumber"
            android:text="@string/button_dot" />

        <Button
            style="@style/buttonOperator"
            android:text="@string/button_equal" />

        <Button
            style="@style/buttonOperator"
            android:text="@string/button_plus" />
    </LinearLayout>
</LinearLayout>

Style.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <style name="buttonRow">
        <item name="android:layout_weight">1</item>
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">0dp</item>
    </style>

    <style name="buttonNumber">
        <item name="android:layout_weight">1</item>
        <item name="android:layout_width">0dp</item>
        <item name="android:layout_height">match_parent</item>
        <item name="android:background">@null</item>
        <item name="android:textSize">25sp</item>
        <item name="android:textColor">@color/white</item>
    </style>

    <style name="buttonOperator">
        <item name="android:layout_weight">1</item>
        <item name="android:layout_width">0dp</item>
        <item name="android:layout_height">match_parent</item>       
        <item name="backgroundColor">@color/orange</item>
        <item name="android:textSize">25sp</item>
        <item name="android:textColor">@color/white</item>
    </style>
</resources>

Theme.xml

<resources xmlns:tools="http://schemas.android.com/tools">

<style name="Theme.UnitConverterAdvance" 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>

<style name="Theme.UnitConverterAdvance.Calculator" parent="Theme.AppCompat">
    <!-- Primary brand color. -->
    <item name="colorPrimary">@color/light_Black</item>
    <item name="colorPrimaryVariant">@color/orange</item>
    <item name="colorOnPrimary">@color/white</item>
    <!-- Status bar color. -->
    <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
</style>

</resources>

Answer 1

as indicated by commonsware in his comment, the answer is in using the backgroundTint instead of the backgroundColor in the Style.xml. or changing 'button' tag into 'android.widget.Button'.

Because since Android Studio 4.1 any Button elements in a layout get turned into MaterialButton widgets, which ignores background attribute.

for more details refer to commonsware answer

Answer 2

////Try to give manually in .xml file it. It works fine.

           <Button
            android:id="@+id/btn_proceToPay"
            android:layout_width="match_parent"
            android:layout_height="56dp"
            android:layout_below="@id/rl3"
            android:layout_marginTop="20dp"
            android:background="@color/primaryBackgroung"
            android:enabled="false"
            android:text="Proceed To Pay"
            android:textAllCaps="false"
            android:textColor="@color/whiteText"
            android:textSize="16sp"
            android:textStyle="bold" />