Sibam
Sibam

Reputation: 45

Button background gradient is not showing

I was trying to set a gradient and rounded shape in the button background. But, the gradient color is not showing in the button while shape is coming properly. Can you please tell me where I'm going wrong?

This is my Button xml code,

    <FrameLayout
    android:id="@+id/frameLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="76dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="parent">


    <ImageButton
        android:id="@+id/verifyButton"
        android:layout_width="300dp"
        android:layout_height="70dp"
        android:layout_marginBottom="20dp"
        android:layout_marginEnd="50dp"
        android:layout_marginStart="50dp"
        android:layout_marginTop="20dp"
        android:fontFamily="@font/aclonica"
        android:background="@drawable/button"
        android:textSize="16sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/buttonText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:fontFamily="@font/aclonica"
        android:text="Verify"
        android:textColor="@color/white"
        android:textSize="25sp"
        android:textStyle="bold"
        android:layout_gravity="center"/>

    <ProgressBar
        android:id="@+id/progressBar"
        style="?android:attr/progressBarStyle"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_gravity="center"
        android:visibility="gone" />

</FrameLayout>

And this is my drawable resource file xml code,

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<gradient android:startColor="@color/light_blue" android:endColor="@color/dark_blue"/>
<corners android:radius="50dp"/>
</shape>

Please help me with this. Thank you

Upvotes: 0

Views: 424

Answers (2)

Sibam
Sibam

Reputation: 45

I got the solution. By adding this code in the button xml file, it worked just fine.

app:backgroundTint="@null"

Upvotes: 2

Eishon
Eishon

Reputation: 1324

Add this to your drawable folder and add it ass background of the button.

round_gradient_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#eeffffff" />
    <corners android:bottomRightRadius="16dp"
        android:bottomLeftRadius="16dp"
        android:topRightRadius="16dp"
        android:topLeftRadius="16dp"/>
    <gradient
        android:startColor="#ffff00"
        android:centerColor="#00ffff"
        android:endColor="#ff0000"
        android:angle="45" />
</shape>

Then go to your res/values/themes.xml

change

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

to

<item name="colorPrimary">@null</item>

Upvotes: 0

Related Questions