How To Create Round Button In Android

Do you want to make the corners of abutton round in Android? In this tutorial, you will learn an easy way to achieve this in Android.

To create an Android button rounded corners have to use a new XML file. This new XML file will be inside a drawable folder. To change the corners of all sides of the button need only one attribute in the drawable XML file.

            android:radius="15dp"

To change one or two or three corners, you have to use the following attributes:-

            android:bottomLeftRadius="7dp" android:bottomRightRadius="7dp" android:topLeftRadius="7dp" android:topRightRadius="7dp

Build an Android app with rounded buttons designs:

Here is step by step creating a roundedcorner buttonwith background color in android.

Step 1. Create a new project "Build Your First Android App in Kotlin"

Step 2.Create a new XML file and add the below code.

Filename: rounded_button.xml

Location: res/drawable/rounded_button.xml

Step 3.Add following code in "activity_main.xml"

Adding a Button in UI.

            <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:app="http://schemas.android.com/apk/res-auto"     xmlns:tools="http://schemas.android.com/tools"     android:layout_width="match_parent"     android:layout_height="match_parent"     tools:context=".MainActivity">      <Button         android:id="@+id/button"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:background="@drawable/rounded_button"         android:text="All corners RoundedButton"         android:textColor="#fff"         android:layout_margin="10dp"         android:paddingLeft="15dp"         android:paddingRight="15dp"/>  </LinearLayout>

Step 7. Now Run the application, in an emulator or on your Android device

Output screenshot Android corner button example:

Download source code of button design from an Activity in Kotlin

https://github.com/EyeHunts/AndroidButtonRoundedCorners

Q: What is an android material button and how to set the corners (radius) of it?

Answer: Material Button is a customizable button component with updated visual styles

How to Use

            <com.google.android.material.button.MaterialButton     android:id="@+id/material_button"     android:layout_width="wrap_content"     android:layout_height="wrap_content"     android:text="@string/button_label_enabled"/>  <com.google.android.material.button.MaterialButton     android:id="@+id/disabled_material_button"     android:layout_width="wrap_content"     android:layout_height="wrap_content"     android:enabled="false"     android:text="@string/button_label_disabled"/>  <com.google.android.material.button.MaterialButton     android:id="@+id/material_unelevated_button"     style="@style/Widget.MaterialComponents.Button.UnelevatedButton"     android:layout_width="wrap_content"     android:layout_height="wrap_content"     android:text="@string/unelevated_button_label_enabled"/>

Read more official document link: https://material.io/develop/android/components/material-button/

Q: How to create a circle buttonin android?

Answer: Same as the above example, use XML drawable file:

Save the following contents asround_button.xml indrawable folder.

            <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android">     <item android:state_pressed="false">         <shape android:shape="oval">             <solid android:color="#fa09ad"/>         </shape>     </item>     <item android:state_pressed="true">         <shape android:shape="oval">             <solid android:color="#c20586"/>         </shape>     </item> </selector>

Android Material Effect: AlthoughFloatingActionButton is a better option, If you want to do it using XML selector, create a folder drawable-v21 in res and save another round_button.xml there with the following XML.

            <?xml version="1.0" encoding="utf-8"?> <ripple xmlns:android="http://schemas.android.com/apk/res/android"     android:color="#c20586">     <item>         <shape android:shape="oval">             <solid android:color="#fa09ad"/>         </shape>     </item> </ripple>

And set it as background ofButton in xml like this:

            <Button android:layout_width="50dp" android:layout_height="50dp" android:background="@drawable/round_button" android:gravity="center_vertical|center_horizontal" android:text="hello" android:textColor="#fff" />

Important:

To show all state: -enabled, disabled, highlighted, etc, you have to use selector as described here.
You've to keep both files in order to make the drawable backward-compatible. Otherwise, you'll face weird exceptions in the previous android version

Source: https://stackoverflow.com/questions/9884202/custom-circle-button

Q: How to create Android button rounded corners programmatically?

Answer: Here code for how to createGradientDrawable shape programmatically.

            GradientDrawable shape = new GradientDrawable(); shape.setShape(GradientDrawable.RECTANGLE); shape.setColor(Color.RED); shape.setStroke(3, Color.YELLOW);

And change the radius for all corners of the button.

            shape.setCornerRadius(15);

or Change the radius for specific corners of the button.

            shape.setCornerRadii(new float[] { 8, 8, 8, 8, 0, 0, 0, 0 });

And finally, use this drawable as a background as of button widget:

            view.setBackgroundDrawable(shape);

Note: A button design topic is UI design. in this tutorial, we used a Kotlin programming language in Main Activity and will work the same with java code.

Do comment if you have any doubts and suggestions on this tutorial.

Note: This example (Project) is developed in Android Studio 3.3.2. Tested on Android 9 ( Android-P), compile SDK version API 28: Android 9.0 (Pie)
MinSdkVersion="25″
TargetSdkVersion="28″
Coding in Kotlin

Degree in Computer Science and Engineer: App Developer and has multiple Programming languages experience. Enthusiasm for technology & like learning technical.