How to create a button with rounded corners in android

In this tutorial we will see how to make a Button with rounded corners. In some applications we can see the button with  rounded corners and borders.Android is not providing any default Button widget with rounded corners ,  but we can achieve this by setting a drawable background for the default Button in android.

Steps

  • Create new project in android studio
  • Implement custom drawable file for button
  • Create the Button in layout file with custom background
  • Add the required colors

Create project in android studio

Refer Android beginners app development guide if you are beginner or if you don’t know how to create project in android studio.

Implement custom drawable file for textview

If we want a custom background for a button we need to have a drawable file which defines the shape,size and color of the button layout and this will be the drawable which will set as background of the button in the layout file. So in this step you need  to have an xml file under your res/drawable/

rounded_corner_button.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="@color/colorPrimary"/>

            <stroke
                android:color="@color/colorAccent"
                android:width="2dp" />

            <corners
                android:radius="15dp" />
        </shape>
    </item>
</selector>

Create the Button in layout file with custom background

Once the drawable file is created you need to create the button in your layout file and simply use the above drawable file in your textview as in the following code

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Rounded Button"
    android:background="@drawable/rounded_corner_button"
    android:textColor="@color/white"
    android:layout_centerVertical="true"
    android:layout_centerHorizontal="true"
    android:padding="15dp"
    />

Add the required colors

Add the following colors into colors.xml which is using in above codes

<color name="colorPrimary">#3F51B5</color>
<color name="colorAccent">#FF4081</color>
<color name="white">#FFFFFF</color>

output

android-rounded-button
android-rounded-button
 

About the author

Hi guys, i am the author of codesfor. I am a B.Tech graduate currently working as an App developer. Apart from job i am a blogger and a freelancer.

Add a Comment

Your email address will not be published. Required fields are marked *