How to create a Circular TextureView for camera2 api

Question

I'm creating a masking layout over the TextureView but it doesn't fulfil my requirements as I want to convert the captured image to circular shape later. Is there any way to create a circular shaped TextureView in Android?

Answer 1

After alot of workarounds got the solution.

Create a shape and place it inside drawable folder

     <?xml version="1.0" encoding="utf-8"?>
         <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape android:shape="rectangle" >
            <solid android:color="@android:color/transparent" />
        </shape>

    </item>
    <item>
        <shape
            android:innerRadiusRatio="2"
            android:shape="ring"
            android:thicknessRatio="1"
            android:useLevel="false" >
            <solid android:color="#80000000" />
            <size
                android:height="148dip"
                android:width="148dip" />

        </shape>

    </item>

</layer-list>

then set the above created shape a background to the masked layer in your xml file like below

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_gravity="center"
    android:gravity="center"
    android:background="@color/background_color"
    android:layout_height="match_parent">



    <RelativeLayout

        android:orientation="vertical"
        android:background="@drawable/ring_shape"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:elevation="2dp"
        android:id="@+id/view2"
        android:layout_centerHorizontal="true"
        android:innerRadius="@dimen/pad2dp">

        <LinearLayout
            android:weightSum="1"
            android:layout_marginBottom="20dp"
            android:id="@+id/bottomLayout"
            android:layout_alignParentBottom="true"
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <ImageView
                android:foreground="@drawable/white_ripple"
                android:clickable="true"
                android:layout_weight="0.30"
                android:layout_gravity="center"
                android:id="@+id/flashCamera"
                android:layout_width="0dp"
                android:layout_height="@dimen/pad30dp"
                android:layout_alignParentBottom="true"
                android:src="@drawable/flash"
                android:text="Capture Image"
                android:visibility="invisible" />

            <ImageView
                android:layout_gravity="center"
                android:foreground="@drawable/white_ripple"
                android:clickable="true"
                android:layout_weight="0.40"
                android:id="@+id/iv_camera_button"
                android:layout_width="0dp"
                android:layout_height="60dp"
                android:layout_alignParentBottom="true"
                android:src="@drawable/shutter"
                android:text="Capture Image"
                android:visibility="visible" />

            <ImageView
                android:foreground="@drawable/white_ripple"
                android:layout_gravity="center"
                android:clickable="true"
                android:layout_weight="0.30"
                android:id="@+id/switchCamera"
                android:layout_width="0dp"
                android:layout_height="@dimen/pad30dp"
                android:layout_alignParentBottom="true"
                android:src="@drawable/rotate"
                android:text="Capture Image"
                android:visibility="visible" />






        </LinearLayout>


    </RelativeLayout>


    <TextureView

        android:foregroundGravity="center"
        android:id="@+id/texture_camera_preview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center" />

    </RelativeLayout>

and that's it...! get the bitmap from textureview surface and then crop it based on the screen and preview resolution..!

Happy Coding..! :)

Answer 2

Use below code may it will solve your problem(This code only convert your Image to circular image not for textureview):

 public class ImageConverter {

    public static Bitmap getRoundedCornerBitmap(Bitmap bitmap, int pixels) {
        Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(output);

        final int color = 0xff424242;
        final Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
        final RectF rectF = new RectF(rect);
        final float roundPx = pixels;

        paint.setAntiAlias(true);
        canvas.drawARGB(0, 0, 0, 0);
        paint.setColor(color);
        canvas.drawRoundRect(rectF, roundPx, roundPx, paint);

        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
        canvas.drawBitmap(bitmap, rect, rect, paint);

        return output;
    }
}