How to add a rectangular overlay in a camera application?

Question

How do I add a rectangular overlay (which should be more like a rectangular frame) in the camera preview? My application consists of a button that opens the camera upon clicking. I need the overlay in that camera preview.

The code for the java file is:

    public class MainActivity extends Activity {
     Button b;
     Intent i;
     Bitmap bmp;
     final static int cameraData = 0;

     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_main);
         b = (Button) findViewById(R.id.button);
         InputStream is = getResources().openRawResource(R.drawable.ic_launcher);
         bmp = BitmapFactory.decodeStream(is);
         b.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
            // TODO Auto-generated method stub
            i = new Intent(android.provider.MediaStore.ACTION_IMAGE_CAPTURE);
            startActivityForResult(i, cameraData);

        }
    });
 }
}

The Layout file is as follows:

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity" >

<TextView
    android:id="@+id/text"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_gravity="center"
    android:text="click to take photo" />

<Button
    android:id="@+id/button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="click"
    android:layout_gravity="center" />

</LinearLayout>

score 25 · Answer 1 · edited Mar 13 '19 at 06:52

First, create a public Class that extends View. Inside its onDraw() method, draw your rectangle. For example:

public class Box extends View {
  private Paint paint = new Paint();
  Box(Context context) {
    super(context);
  }

  @Override
  protected void onDraw(Canvas canvas) { // Override the onDraw() Method
    super.onDraw(canvas);

    paint.setStyle(Paint.Style.STROKE);
    paint.setColor(Color.GREEN);
    paint.setStrokeWidth(10);

    //center
    int x0 = canvas.getWidth()/2;
    int y0 = canvas.getHeight()/2;
    int dx = canvas.getHeight()/3;
    int dy = canvas.getHeight()/3;
    //draw guide box
    canvas.drawRect(x0-dx, y0-dy, x0+dx, y0+dy, paint);
  }
}

Then, in your camera preview Activity, have an instance to your Box class:

Box box = new Box(this);

Finally:

addContentView(box, new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));

A green rectangle will be drawn onto your camera preview.

score 5 · Accepted Answer · edited May 23 '17 at 12:10

5

You have to create your own Preview by extending the SurfaceView class.

See below link which helps you.

Custom camera android

Take FrameLayout with SurfaceView as child.and customise as per your needs

edited May 23 '17 at 12:10

Community

1
1

answered Feb 15 '13 at 11:48

koti

3,681
5
34
58

How do I draw the rectangle? – Ritwik Dey Feb 15 '13 at 11:53
you can take some image and place it on top of the surfaceview – koti Feb 15 '13 at 11:55
ok.. So you suggest I put the image of a rectangle? Is it going to be transparent? – Ritwik Dey Feb 15 '13 at 12:00

How to add a rectangular overlay in a camera application?

2 Answers2

Linked