Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to set the surface view camera background with corner

Tags:

java

android

My app uses a camera surface view layout with a size of 150 X 150. I need to show the surface corner is arc type. how to set the corner in camera.

<LinearLayout
    android:id="@+id/recordView"
    android:layout_width="100dp"
    android:layout_height="150dp"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_marginBottom="50dp"
    android:layout_marginRight="25dp" 
    android:background="@drawable/customshape">
</LinearLayout>

customshape:

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
 android:shape="rectangle"> 
 <gradient android:startColor="#FFFFFF" android:endColor="#FFFFFF"         android:angle="270"/> 

<corners android:bottomRightRadius="50dp" android:bottomLeftRadius="50dp" 
 android:topLeftRadius="50dp" android:topRightRadius="50dp"/> 

this layout add the camera activity but record start show the rectangle view

like image 237
Basheer Avatar asked Jan 28 '26 19:01

Basheer


2 Answers

Check out this tutorial on how to create an Android shape and apply that shape to your layout: http://www.vogella.com/blog/2011/07/19/android-shapes/

Specifically you use the <corners> attribute of the <shape> to create rounded corners, see example below from the above referenced tutorial:

<corners 
    android:bottomRightRadius="7dp"
    android:bottomLeftRadius="7dp" 
    android:topLeftRadius="7dp" 
    android:topRightRadius="7dp"
/>



UPDATE 2 - This worked for me:

drawable-hdpi/rounded.xml:

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

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

    <corners 
        android:bottomRightRadius="7dp" 
        android:bottomLeftRadius="7dp" 
        android:topLeftRadius="7dp" 
        android:topRightRadius="7dp"/> 

    <solid android:color="#00000000" />

</shape>

drawable-hdpi/solid.xml:

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

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

    <solid android:color="#00000000" />

</shape>

drawable-hdpi/rounded_inside_corners.xml:

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

    <item android:drawable="@drawable/rounded" />
    <item android:drawable="@drawable/solid" /> 

</layer-list>


Then in my activity layout:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/my_shape"
    tools:context=".CameraActivity" >

    <SurfaceView
        android:id="@+id/surfaceView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/rounded_inside_corners"
        android:layout_above="@+id/linearLayout1" />

    <FrameLayout
        android:id="@+id/linearLayout1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:orientation="horizontal" >

        <Button
            android:id="@+id/buttonTakePicture"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_gravity="center_horizontal"
            android:background="@drawable/camera_click_256"
            android:gravity="center_horizontal" />
    </FrameLayout>

</RelativeLayout>


Which results in:

enter image description here

like image 180
HeatfanJohn Avatar answered Jan 30 '26 09:01

HeatfanJohn


After more search i try to write code with cardView it worked for me .

Add dependencies :

implementation 'androidx.appcompat:appcompat:1.0.0'
implementation 'androidx.cardview:cardview:1.0.0'

Add code to xml :

 <androidx.cardview.widget.CardView
            android:layout_width="match_parent"
            android:layout_height="270dp"
            app:cardCornerRadius="10dp"
            app:cardPreventCornerOverlap="false">

            <SurfaceView
                android:id="@+id/camera_view"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </androidx.cardview.widget.CardView>
like image 33
Alireza Haji gholamreza Avatar answered Jan 30 '26 10:01

Alireza Haji gholamreza



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!