Android：如何制作圆形的相机预览？

Question

如何创建这样的圆形/椭圆形或圆角的Camera Preview（中间的圆圈应该是Camera Preview）？

<< img src =“ https://image.soinside.com/eyJ1cmwiOiAiaHR0cHM6Ly9pLnN0YWNrLmltZ3VyLmNvbS9WekE3dS5wbmcifQ==” alt =“在此处输入图像描述”>

伦敦图像通过按钮和视图表示UI的其余部分，因此它必须是可见的整体，这就是为什么我不能使用像将android:background添加为半径为如下形状的矩形这样的解决方案的原因：

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#FFFFFF"/>
    <stroke android:width="3dip" android:color="#B1BCBE" />
    <corners android:radius="50dip"/>
    <padding android:left="0dip" android:top="0dip" android:right="0dip" android:bottom="0dip" />
</shape>

并且当我尝试将android:background设置为SurfaceView的椭圆形xml时，它也不起作用：

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">

    <size
        android:width="120dp"
        android:height="120dp"/>

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

如果可以通过某种方式扩展SurfaceView并使用它，请问我应该重写什么？

Answer 1

嗯，我认为最简单的方法是将imageView放在SurfaceView的顶部以xml为例：

<RelativeLayout ....>
  <SurfaceView ... />
  <ImageView ... />
</RelativeLayout>

Answer 2

您可以使用CardView来像这样放置您的textureView或surfaceArea。

<androidx.cardview.widget.CardView
        android:id="@+id/cameraWrapper"
        android:layout_width="300dp"
        android:layout_height="300dp"
        app:cardCornerRadius="360dp"
        android:foreground="@drawable/background_camera_overlay_circle_inactive"
        app:cardElevation="0dp"
        android:padding="-20dp">

        <com.mobile.myapp.CustomViews.CameraSourcePreview //you can use SurfaceView, TextView, ImageView
            android:id="@+id/preview"
            android:layout_width="400dp"
            android:layout_height="400dp"/></androidx.cardview.widget.CardView>

要注意的关键事项。-cornerRadius设置为360以使CardView具有圆形-cardElevation设置为零以消除高程，从而使CardView平整-padding设置为负值，以便将子视图很好地隐藏-子视图的layout_width和layout_height值大于cardView的值。-CardView具有一个前台属性，该属性已设置为可绘制文件background_camera_overlay_circle，该文件仅绘制圆形边框

//backgroung_camera_overlay_circle.xml
<?xml version="1.0" encoding="utf-8"?>
<shape android:shape="oval" xmlns:android="http://schemas.android.com/apk/res/android">
 <stroke android:width="5dp" android:color="@color/colorRed_FB7B7B"/>

尝试一下。