How do I remove shadow from the button?

Question

This is what I'm trying to achieve:

The shadow under the button is my problem. I have tried this:

style="?android:attr/borderlessButtonStyle"

and this:

android:stateListAnimator="@null"

But in both cases button disappears to the background which is a cardview.This is what I'm trying to avoid:

This is the relevant XML:

    <Button
            android:id="@+id/completedtab"
            android:layout_width="203dp"
            android:layout_height="36dp"
            android:layout_marginTop="8dp"
            android:text="Completed"
            android:elevation="0dp"
            android:shadowColor="@null"
            android:textColor="@color/black"
            app:backgroundTint="@null"
            android:background="@drawable/other_unselected_shape"
            app:layout_constraintBottom_toTopOf="@+id/recyclerView"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toEndOf="@+id/inprogresstab"
            app:layout_constraintTop_toBottomOf="@+id/headingdivider"
            app:layout_constraintVertical_bias="0.125" />


<Button
        android:id="@+id/inprogresstab"
        android:layout_width="189dp"
        android:layout_height="36dp"
        android:layout_marginStart="12dp"
        android:layout_marginTop="8dp"
        android:text="In progress"
        android:textColor="@color/black"
        app:backgroundTint="@null"
        android:elevation="0dp"
        android:background="@drawable/selected_shape"
        app:layout_constraintBottom_toTopOf="@+id/recyclerView"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/headingdivider"
        app:layout_constraintVertical_bias="0.117" />

<androidx.cardview.widget.CardView
        android:layout_width="370dp"
        android:layout_height="36dp"
        android:layout_marginTop="1dp"
        android:layout_marginBottom="29dp"
        app:cardBackgroundColor="#F1EFEF"
        app:cardCornerRadius="20dp"
        app:cardElevation="0dp"
        app:layout_constraintBottom_toTopOf="@+id/recyclerView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.292"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/completedtab" />

Selectedshape XML

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item >
    <shape   android:shape="rectangle">

    <solid
        android:color="#FFD600"
        />

        <corners android:bottomRightRadius="20dp"
            android:bottomLeftRadius="20dp"
            android:topRightRadius="20dp"
            android:topLeftRadius="20dp"/>

        <stroke android:width="2dp"
            android:color="#FFD600"

            />
    </shape>
    </item>



</selector>

Unselected shape XML

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item >
        <shape   android:shape="rectangle">

            <solid
                android:color="#F1EFEF" />

            <corners android:bottomRightRadius="20dp"
                android:bottomLeftRadius="20dp"
                android:topRightRadius="20dp"
                android:topLeftRadius="20dp"/>

            <stroke android:width="1dp"
                android:color="#F1EFEF"

                />
        </shape>
    </item>

</selector>

score 0 · Answer 1 · edited Apr 01 '22 at 05:41

0

I reduced the opacity of the unselected button's color in the unselected button xml. And the shadow was gone.

<item >
    <shape   android:shape="rectangle">

        <solid
            android:color="#80F1EFEF" />

        <corners android:bottomRightRadius="20dp"
            android:bottomLeftRadius="20dp"
            android:topRightRadius="20dp"
            android:topLeftRadius="20dp"/>

        <stroke android:width="1dp"
            android:color="#F1EFEF"

            />
    </shape>
</item>

Notice the change of color from #F1EFEF to #80F1EFEF

edited Apr 01 '22 at 05:41

Nimantha

6,405
6
28
69

answered Apr 01 '22 at 03:49

Shehar

443
1
4
12

You can see that: https://stackoverflow.com/questions/28756035/how-to-remove-button-shadow-android – Eitan Apr 01 '22 at 08:09

How do I remove shadow from the button?

1 Answers1