How to create EditText with rounded corners in Android

In this article, we’ll show you how to create a custom EditText with rounded corners in Android, perfect for enhancing the aesthetics of your app. By the end of this tutorial, you’ll have a beautiful, user-friendly input field that your users will appreciate.

Output:

Example of EditText with rounded corners in Android

Now, we will create an android application. Then, we will use Edittext in this application.

Open Android Studio.
Go to File => New => New Project. Write application name. Then, click next button.
Select minimum SDK you need. However, we have selected 21 as minimum SDK. Then, click next button
Then, select Empty Activity => click next => click finish.
If you have followed above process correctly, you will get a newly created project successfully. However, you can also visit post to create a new project to know steps in detail.

Let’s modify xml and java file to create Edittext with rounded corners in android.

First of all create a new resource file in drawables and name it bg_edit_text like below.

bg_edit_text.xml:

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android"

android:shape="rectangle">

<stroke

android:width="2dp"

android:color="@color/black" />

</shape>

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>

<androidx.constraintlayout.widget.ConstraintLayout 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"

android:padding="16dp"

tools:context=".MainActivity">

<EditText

android:id="@+id/editText"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:background="@drawable/bg_edit_text"

android:hint="Enter your name..."

android:padding="10dp"

app:layout_constraintBottom_toBottomOf="parent"

app:layout_constraintEnd_toEndOf="parent"

app:layout_constraintStart_toStartOf="parent"

app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

1. XML Layout: The code snippet provided uses XML to define the layout of your Android app. Inside a ConstraintLayout, you’ll find an EditText element. This EditText is where users will input text. You can customize its appearance and behavior to meet your app’s needs.

2. Custom Background: To create the rounded corner effect, a custom background is applied to the EditText. The custom background is defined in a separate XML file. It uses a shape element to create a rectangle with rounded corners. The ‘android:radius’ attribute determines the radius of the corners, in this case, set to 10dp. The ‘android:width’ and ‘android:color’ attributes define the stroke around the rectangle, making it appear like a border.

3. Applying the Background: The EditText element references this custom background by setting ‘android:background=”@drawable/bg_edit_text”‘. This line of code tells the EditText to use the defined shape as its background, resulting in the rounded corner appearance.

By following these steps, you can easily implement an EditText with rounded corners in your Android app. It’s a simple yet effective way to make your app more visually appealing and user-friendly. Users will appreciate the attention to detail, and it can help improve the overall user experience.

This customization allows you to match the style of the EditText to your app’s design, ensuring a consistent and attractive look and feel. Whether you’re building a social media app, a note-taking app, or any other Android application that uses text input, a custom EditText can add a touch of elegance and uniqueness to your project. Give it a try, and watch your app’s aesthetics and user satisfaction soar!