How To Create Surfaceview With Rounded Corners

I am having a difficulty to round the corners of surfaceview. I am using MjpegView (custom view that inherit from surfaceview. I tried already this solutions: 1) set backgroun

Solution 1:

If I understand your question correcly:

1. create a <FrameLayout ...> with 2 children: the surface view and a partially transparent cover layer above it. (FrameLayout draws its children one on top of another.)

2. draw the rounded corners on the cover layer.

That is, you will have an opaque layer above the SurfaceView and that opaque layer will have a transparent hole-with-rounded-corners in its center.

Here's an example where I cover a SurfaceView with a 50%-transparent black layer (visibility="invisible" by default) and a RelativeLayout with buttons inside.

<FrameLayoutandroid:layout_width="fill_parent"android:layout_height="fill_parent" ><SurfaceViewandroid:id="@+id/camera_preview"android:layout_width="fill_parent"android:layout_height="fill_parent"android:layout_centerInParent="true" /><Viewandroid:id="@+id/transparency"android:layout_width="fill_parent"android:layout_height="fill_parent"android:background="#80000000"android:visibility="invisible"
        /><RelativeLayoutandroid:id="@+id/xxxxx"android:layout_width="fill_parent"android:layout_height="fill_parent"
        >
        ...

Solution 2:

To achieve what you ask, it is very easy to do it. You only need to use the next XML:

<androidx.cardview.widget.CardViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"app:cardCornerRadius="12dp"><SurfaceViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center" /></androidx.cardview.widget.CardView>

And to use this CardView, add this dependency on your build.gradle app:

implementation 'androidx.cardview:cardview:1.0.0'