Android How How to Make the Corners of Button Round

Android How How to Make the Corners of Button Round

Android How How to Make the Corners of Button Round

In this artilce we are going to create a android button with round corner. Below image showing some sample button.

 

Follow below steps to create a button with round corner in Android Studio

Step 1: First we are going to add a default button in our layout.

<Button
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="New Button"
/>

Step 2: Now we have multiple options. Let’s discuss the easy way to achieve our scenario. Modify your button as shown in below code. Or add android:radius=”20dp”

<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:radius="20dp"
        />

OR

Step 2: As show in previous method android:radius is going to set all corner of a button with radius to 20. Now, what if we want different radius on different corners. For this we need to modify our button code as below code.

<Button
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:text="New Button"
 android:topRightRadius="0dp"
 android:topLeftRadius="10dp"
 android:bottomLeftRadius="5dp"
 android:bottomRightRadius="20dp"
/>

In the above code all button corner have different radius.

OR

Step 2: Finally we are going to use a drawable file to control the button shape. We created a new xml file with name roundcornerbutton and below code. Finally added background property for button android:background=”@drawable/roundcornerbutton”

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#FF0000"/>
            <!-- corners is use to create a round corner shape -->
            <corners android:radius="15dp" />
        </shape>
    </item>
</selector>

 

<Button
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:text="New Button"
 android:background="@drawable/roundcornerbutton"
/>

Note: you can also specify radius for each corner using bottomLeftRadius, bottomRightRadius, topLeftRadius, topRightRadius

Below are some example of rounded corner button created using one of the above mentioned method.

You make like this video, How to create Round Button

0 Comments
Leave A Comment

Please login to post your valuable comments.

Join the newsletter

Get the latest vLemonn news first

share