FrameLayout with rounded corners

Question

I have a FrameLayout inside my root view (linear:vertical) that I'm using to hold different fragments depending on user input. The FrameLayout is smaller than the background, so it appears to be "floating".

How do I round the corners of the FrameLayout?

The frags that go inside the FrameLayout are not pictures, so I can't crop them.

Can't you just thrown in a hand-crafted drawable as background of your FrameLayout? — m02ph3u5, Mar 25 '16 at 19:43

score 40 · Accepted Answer · edited Jul 18 '20 at 19:23

Create an xml file, e.g. your_rounded_shape.xml, in your drawable folder and add the following code:

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
    <solid android:color="#CCCCCC"/>    

    <stroke android:width="2dp"
        android:color="#999999"/>

    <padding android:left="2dp"
         android:top="2dp"
         android:right="2dp"
         android:bottom="2dp"/> 

    <corners android:radius="8dp" />
</shape>

Then use your_rounded_shape.xml as a background in your FrameLayout. Something like this:

<FrameLayout
    android:width="match_parent"
    android:height="wrap_content"
    android:background="@drawable/your_rounded_shape"/>

This is perfect! Thank you, it is exactly what I was looking for. — Dan Lehto, Mar 25 '16 at 19:18

score 11 · Answer 2 · answered Aug 09 '18 at 15:45

11

Replace the FrameLayout with CardView layout.

<android.support.v7.widget.CardView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:cardCornerRadius="8dp">

</android.support.v7.widget.CardView>

answered Aug 09 '18 at 15:45

Farid Z

960
1
9
18

score 0 · Answer 3 · answered Aug 12 '19 at 06:22

Just an improvement of the above answer: name of this xml file in let's say rounded_frame_layout.xml

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
    <solid android:color="#CCCCCC"/>    

    <stroke android:width="2dp"
        android:color="#999999"/>

    <padding android:left="2dp"
         android:top="2dp"
         android:right="2dp"
         android:bottom="2dp"/> 

    <corners android:radius="8dp"/> 
</shape>


Then use your drawable as follows:

<FrameLayout
     android:width="match_parent"
     android:height="wrap_content"
     android:background="@drawable/rounded_frame_layout"/>

This makes the shape not reusable – Jeremi Sep 22 '20 at 13:17 — Jeremi, Sep 22 '20 at 13:17

FrameLayout with rounded corners

3 Answers3