Search code examples
androidxmlandroid-studioandroid-layoutandroid-studio-2.3

Adding a border/outline to buttons in android studio


I would like to add a border to a button.

I have tried the usual stuff i.e creating a drawable file and referencing that in the xml file. But this does not seem to be working. Anyone know why?

Here is my XML code for the button:

<Button
        android:id="@+id/logoutButton"
        android:layout_width="357dp"
        android:layout_height="51dp"
        android:background="@drawable/round_btn"
        android:fontFamily="@font/work_sans"
        android:text="Log Out"
        android:textAllCaps="false"
        android:textSize="16sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.46"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.992"
         />

Here is my code for the drawable file 'round_btn':

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#6200EE"/>
    <stroke
        android:width="20px"
        android:color="#000000"
        />
    <corners
        android:radius="50dp"
        />
</shape>

No border is added but the corners are modified (curved).


Solution

  • Adding this line:

    app:backgroundTint="@null"
    

    solves the problem.

    So, your final code (for the button) becomes:

    <Button
            android:id="@+id/logoutButton"
            android:layout_width="357dp"
            android:layout_height="51dp"
            android:background="@drawable/round_btn"
            android:fontFamily="@font/work_sans"
            android:text="Log Out"
            android:textAllCaps="false"
            android:textSize="16sp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.46"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.992"
            app:backgroundTint="@null"
            />
    

    You may look into this question: Android Background Drawable Not Working in Button Since Android Studio 4.1 for more information (Credit to question asker & some answerers, part(s) of this answer may have been inspired/taken from them)