Creating Rounded Corner Button In Android Studio

Creating a rounded button in android studio is not so hard. In this android studio tutorial we will learn how to create rounded buttons with different styles. We also create the icon button which can be on the left or right side of the button.

Rounded buttons in android are mostly used because these look good and match with the design of the screen and the theme color. Most of the app screens use round corners buttons.

material design button in android studio
button in android studio

Button In Android Studio

Buttons in android studio are used to perform some task when we tap or press on it. These are the parts of GUI which have the feature of tapping or clicking. They call any function or move to another screen or can do anything which we want to perform. Rounded Buttons are also the same button in android studio, we provide the radius of the corners of the button so it becomes a rounded button.

By default android studio provides a Button widget which we can use but we can not provide rounded corners of it. We have to create a drawable design to make it rounded corners.

Default Button Of Android Studio

button in android studio
button in android studio

In the above screen there is a simple button we can not round its corners. We can change its background color and other properties. This is the default button in android studio.

Creating Rounded Corner of The Simple Button in android Studio

To create the rounded corner of the default Button provided by the android studio, we have to create a Drawable layout as follows and use as below in the button attribute.

Create a drawable layout inside the Drawable directory. Copy and paste following code you can change the background color and radius.

rect_rounded_button.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@color/black"/>
<stroke android:color="@color/black" android:width="1.5dp"/>
<corners android:radius="15dp"/>
</shape>

Now use as below in Button attribute.

   android:background="@drawable/rect_rounded_button"
 <Button
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="15dp"
    android:padding="15dp"
    android:background="@drawable/rect_rounded_button"
    android:textSize="16dp"
    android:gravity="center"
    android:text="Simple 
 Button"/>
rounded button in android studio
rounded button in android studio

How to Change The Background Color of Default Button in Android Studio

Use following code to change the background color of default button in android studio.

  android:backgroundTint="@color/black"
 <Button
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="15dp"
    android:padding="15dp"
    android:backgroundTint="@color/black"
    android:textSize="16dp"
    android:gravity="center"
    android:text="Simple 
 Button"/>
button in android
button in android

Material Design Button in Android Studio

The other type of button is Material design Button in android. These buttons are designed by the material design library anyone can use this button and its other designs.

You should be happy to read that the material design button has the attribute of round shape that is easy to use. There are many other features which are more that the default button of android studio.

Material Design Dependency

Add the following material design library in your build,gradle file. Higher versions of android studio already have this material design library.

 implementation 'com.google.android.material:material:1.4.0'

Use MaterialButton widget in your layout file.

Rounded Corners of Material Button

Use following attribute to provide radius of corners.

app:cornerRadius=”15dp”

How to Change the Background Color of Material Design Button

To change the background color of the material design button use the following feature inside the Material Button widget.

android:backgroundTint=”@color/black”

Complete code of Material Rounded Button in Android Studio

Use the following code to create the rounded corner button in your android project. You can see more features on the material design website.

 <com.google.android.material.button.MaterialButton
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Material Button"
    android:textSize="18dp"
    android:layout_margin="20dp"
    android:backgroundTint="@color/black"
    android:padding="15dp"
    app:cornerRadius="15dp"/>
material design button in android studio
material button in android

Click Event On Button

SetOnClickListener() used to create a Tap or Click event. Write setOnclick and you will see dropdowns, select setOnclickListener from there and write new and capital O in parantheses and select the method from dropdown. Use following code for button click event.

 button.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        
        //write your code here
        
    }
 });

Please comment if this tutorial is helpful to you even if there is any issue in this code. 

We suggest you to learn android DataBinding in android which is most useful for android developers. DataBinding is easy and simple to learn.

Learn more Android and Flutter tutorials which will improve your development skills.


close

Don’t miss new tips!

We don’t spam! Read our [link]privacy policy[/link] for more info.

Leave a Comment