Rounded Corners

Welcome to "Android Super Nerds"

Myself Vinod Yadav and this is going to be my second blog site. 

The only purpose for making this blog is, to share information and solve most of the query/error we face while making an Android App.

Here we are just going to focus on Android App Technology including Native and Cross-Platform. Now when we talk about Android App, only the thing which comes to mind is its "UI". Face It Guys, if your UI is not impressive none of the people will waste its precious time in downloading it. Google Play Store is full of so many App with great UI and design.

And this article is all about Android UI design including custom UI as well. So feel free to add your comments or request for any custom UI implementation. As the topic read, you are about to know how to create and implement "Rounded Corner" for TextView, EditView or any Parent View including the custom view.
  
Note:- I still remember how tough it was during my beginning as an "Android Developer" to implement such a small effect on any component. 

Anyways let get started.....

First create a drawable XML, select "drawable folder" and on the Right Click select "New" and then click on "Drawable resource file". 

For implementing Rounded Corner around any View/Component, we are going to add a drawable XML file into the drawable folder.

I had created and added two drawable known as "bg_with_circular_border.xml" and "bg_with_no_border.xml".

bg_with_circular_border:

bg_with_no_border:

So what really happening here is:

shape: which shape actually you are looking for "rectangle".corners: to curve the edge.solid: for setting up the background color.stroke: here "width" is for the thickness of the borderline and "color" is for adding the border color.

Now we are going to create a layout for applying this drawable style as a background for its view. 

and on the actual device, the view is going to look like this:

AND THAT'S All Folks.

If you have any questions regarding Gradient XML, custom style or any of the UI components, Please do Leave a comment below..!! 

Until then 

" Enjoy coding and if you like this article don’t forget to like and share it. "

---

Update (September 2026): the modern way with Material 3 and Jetpack Compose

The drawable XML approach above still works, but you no longer need a separate file for every colour and radius. Here are the current options.

Material components with a corner radius

If the rounded area is a card, use MaterialCardView and set the radius directly in the layout. It also handles the elevation and the ripple for you:

<com.google.android.material.card.MaterialCardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardCornerRadius="16dp"
    app:strokeWidth="2dp"
    app:strokeColor="?attr/colorPrimary">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:text="Rounded card" />

</com.google.android.material.card.MaterialCardView>

Round any view in Kotlin

To give any view a rounded background from code, build a MaterialShapeDrawable from a ShapeAppearanceModel:

val radius = resources.getDimension(R.dimen.corner_radius)

val shapeModel = ShapeAppearanceModel.builder()
    .setAllCornerSizes(radius)
    .build()

val background = MaterialShapeDrawable(shapeModel).apply {
    fillColor = ColorStateList.valueOf(Color.parseColor("#6650A4"))
    setStroke(4f, Color.WHITE)
}

binding.myView.background = background

Use setCornerSize or the per-corner builders such as setTopLeftCornerSize when only some corners should be round.

Jetpack Compose

In Compose there is no drawable at all. Pass a shape to the background modifier:

Box(
    modifier = Modifier
        .size(160.dp)
        .background(Color(0xFF6650A4), RoundedCornerShape(16.dp))
        .border(2.dp, Color.White, RoundedCornerShape(16.dp))
)

To round an image or cut any content to a shape, use Modifier.clip(RoundedCornerShape(16.dp)). Material 3 components such as Card and Button take a shape parameter, so you rarely need to clip them yourself.

Which one should you use?

• For a card or button in an XML layout: use the Material component and its radius attribute.
• For a custom background you set from code: use MaterialShapeDrawable.
• For a new screen: build it in Compose and pass a Shape.
• The drawable XML from this post is still fine for a simple, fixed background.