title: How to draw rectangle on a camera preview in android
body: <p>Actually I don't understand how to implement the rectangle on the camera preview. Everything working well, but I don't know the way to put the rectangle border like this link. Please anyone help me. Thanks.</p>
  
  <pre><code>package com.example.redsignal.eventbizz;
  public class CameraActivity extends AppCompatActivity {
  
  public static final String FRAGMENT_TAG = "camera";
  private static final int REQUEST_CAMERA_PERMISSIONS = 931;
  private static final int REQUEST_PREVIEW_CODE = 1001;
  @Bind(R.id.settings_view)
  CameraSettingsView settingsView;
  @Bind(R.id.flash_switch_view)
  FlashSwitchView flashSwitchView;
  @Bind(R.id.front_back_camera_switcher)
  CameraSwitchView cameraSwitchView;
  @Bind(R.id.record_button)
  RecordButton recordButton;
  @Bind(R.id.cameraLayout)
  View cameraLayout;
  Button btn_orc, btn_qr;
  @Override
  protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_camera);
      ActionBar actionBar = getSupportActionBar();
      actionBar.hide();
      ButterKnife.bind(this);
      btn_orc = (Button) findViewById(R.id.btn_orc);
      btn_orc.setOnClickListener(new View.OnClickListener() {
          @Override
          public void onClick(View v) {
              Intent intent = new Intent(CameraActivity.this, CameraActivity.class);
              startActivity(intent);
              TastyToast.makeText(CameraActivity.this, "BCR Mode", TastyToast.LENGTH_LONG, TastyToast.INFO);
              finish();
          }
      });
      btn_qr = (Button) findViewById(R.id.btn_qr);
      btn_qr = (Button) findViewById(R.id.btn_qr);
      btn_qr.setOnClickListener(new View.OnClickListener() {
          @Override
          public void onClick(View view) {
              Intent intent = new Intent(CameraActivity.this, QRCameraActivity.class);
              startActivity(intent);
              TastyToast.makeText(CameraActivity.this, "QR Mode", TastyToast.LENGTH_LONG, TastyToast.INFO);
              finish();
          }
      });
      if (Build.VERSION.SDK_INT &gt; 15) {
          final String[] permissions = {
                  Manifest.permission.CAMERA,
                  Manifest.permission.RECORD_AUDIO,
                  Manifest.permission.WRITE_EXTERNAL_STORAGE,
                  Manifest.permission.READ_EXTERNAL_STORAGE};
  
          final List&lt;String&gt; permissionsToRequest = new ArrayList&lt;&gt;();
          for (String permission : permissions) {
              if (ActivityCompat.checkSelfPermission(this, permission) != PackageManager.PERMISSION_GRANTED) {
                  permissionsToRequest.add(permission);
              }
          }
          if (!permissionsToRequest.isEmpty()) {
              ActivityCompat.requestPermissions(this, permissionsToRequest.toArray(new String[permissionsToRequest.size()]), REQUEST_CAMERA_PERMISSIONS);
          } else addCamera();
      } else {
          addCamera();
      }
  }
  
  
  @OnClick(R.id.flash_switch_view)
  public void onFlashSwitcClicked() {
      final CameraFragmentApi cameraFragment = getCameraFragment();
      if (cameraFragment != null) {
          cameraFragment.toggleFlashMode();
      }
  }
  
  @OnClick(R.id.front_back_camera_switcher)
  public void onSwitchCameraClicked() {
      final CameraFragmentApi cameraFragment = getCameraFragment();
      if (cameraFragment != null) {
          cameraFragment.switchCameraTypeFrontBack();
      }
  }
  
  @OnClick(R.id.record_button)
  public void onRecordButtonClicked() {
      final CameraFragmentApi cameraFragment = getCameraFragment();
      if (cameraFragment != null) {
          cameraFragment.takePhotoOrCaptureVideo(new CameraFragmentResultAdapter() {
  
                                                     @Override
                                                     public void onPhotoTaken(byte[] bytes, String filePath) {
                                                         Toast.makeText(getBaseContext(), "onPhotoTaken " + filePath, Toast.LENGTH_SHORT).show();
                                                     }
                                                 },
                  "/storage/self/primary",
                  "photo0");
      }
  }
  
  @OnClick(R.id.settings_view)
  public void onSettingsClicked() {
      final CameraFragmentApi cameraFragment = getCameraFragment();
      if (cameraFragment != null) {
          cameraFragment.openSettingDialog();
      }
  }
  
  
  
  @Override
  public void onRequestPermissionsResult(int requestCode, @NonNull String[] permissions, @NonNull int[] grantResults) {
      super.onRequestPermissionsResult(requestCode, permissions, grantResults);
      if (grantResults.length != 0) {
          addCamera();
      }
  }
  
  @RequiresPermission(Manifest.permission.CAMERA)
  public void addCamera() {
      cameraLayout.setVisibility(View.GONE);
      cameraLayout.setVisibility(View.VISIBLE);
  
      final CameraFragment cameraFragment = CameraFragment.newInstance(new Configuration.Builder()
              .setCamera(Configuration.CAMERA_FACE_REAR).build());
      getSupportFragmentManager().beginTransaction()
              .replace(R.id.content, cameraFragment, FRAGMENT_TAG)
              .commitAllowingStateLoss();
  
      if (cameraFragment != null) {
  
  
          cameraFragment.setStateListener(new CameraFragmentStateAdapter() {
  
              @Override
              public void onCurrentCameraBack() {
                  cameraSwitchView.displayBackCamera();
              }
  
              @Override
              public void onCurrentCameraFront() {
                  cameraSwitchView.displayFrontCamera();
              }
  
              @Override
              public void onFlashAuto() {
                  flashSwitchView.displayFlashAuto();
              }
  
              @Override
              public void onFlashOn() {
                  flashSwitchView.displayFlashOn();
              }
  
              @Override
              public void onFlashOff() {
                  flashSwitchView.displayFlashOff();
              }
  
  
  
              @Override
              public void shouldRotateControls(int degrees) {
                  ViewCompat.setRotation(cameraSwitchView, degrees);
                  ViewCompat.setRotation(flashSwitchView, degrees);
              }
  
              @Override
              public void onRecordStatePhoto() {
                  recordButton.displayPhotoState();
              }
  
          });
  
          cameraFragment.setControlsListener(new CameraFragmentControlsAdapter() {
              @Override
              public void lockControls() {
                  cameraSwitchView.setEnabled(false);
                  recordButton.setEnabled(false);
                  settingsView.setEnabled(false);
                  flashSwitchView.setEnabled(false);
              }
  
              @Override
              public void unLockControls() {
                  cameraSwitchView.setEnabled(true);
                  recordButton.setEnabled(true);
                  settingsView.setEnabled(true);
                  flashSwitchView.setEnabled(true);
              }
  
              @Override
              public void allowCameraSwitching(boolean allow) {
                  cameraSwitchView.setVisibility(allow ? View.VISIBLE : View.GONE);
              }
  
              @Override
              public void allowRecord(boolean allow) {
                  recordButton.setEnabled(allow);
              }
  
          });
  
      }
  }
  
  private CameraFragmentApi getCameraFragment() {
      return (CameraFragmentApi) getSupportFragmentManager().findFragmentByTag(FRAGMENT_TAG);
  }
  </code></pre>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>  &lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:tools="http://schemas.android.com/tools"
      android:orientation="vertical"
      android:layout_width="match_parent"
      android:layout_height="match_parent"&gt;
  
      &lt;FrameLayout
          android:id="@+id/content"
          android:layout_width="match_parent"
          android:layout_height="match_parent"/&gt;
  
  
      &lt;RelativeLayout
          android:id="@+id/cameraLayout"
          android:visibility="gone"
          tools:visibility="visible"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          &gt;
  
          &lt;RelativeLayout
              android:layout_width="match_parent"
              android:layout_height="60dp"
              android:layout_alignParentEnd="true"
              android:layout_alignParentRight="true"
              android:layout_alignParentTop="true"
              android:paddingTop="10dp"&gt;
  
              &lt;com.github.florent37.camerafragment.widgets.CameraSettingsView
                  android:id="@+id/settings_view"
                  android:layout_width="40dp"
                  android:layout_height="40dp"
                  android:layout_alignParentLeft="true"
                  android:layout_centerVertical="true"
                  android:layout_marginLeft="15dp"
                  tools:ignore="RtlHardcoded" /&gt;
  
              &lt;com.github.florent37.camerafragment.widgets.FlashSwitchView
                  android:id="@+id/flash_switch_view"
                  android:layout_width="40dp"
                  android:layout_height="40dp"
                  android:layout_centerInParent="true" /&gt;
  
              &lt;com.github.florent37.camerafragment.widgets.CameraSwitchView
                  android:id="@+id/front_back_camera_switcher"
                  android:layout_width="40dp"
                  android:layout_height="40dp"
                  android:layout_alignParentRight="true"
                  android:layout_centerVertical="true"
                  android:layout_marginRight="15dp"
                  tools:ignore="RtlHardcoded" /&gt;
  
          &lt;/RelativeLayout&gt;
  
          &lt;!--android:background="#82000000"--&gt;
          &lt;RelativeLayout
              android:id="@+id/record_panel"
              android:layout_width="match_parent"
              android:layout_height="80dp"
              android:background="@android:color/transparent"
              android:layout_alignParentBottom="true"
              android:layout_alignParentLeft="true"
              android:layout_alignParentStart="true"&gt;
  
              &lt;com.github.florent37.camerafragment.widgets.RecordButton
                  android:id="@+id/record_button"
                  android:layout_width="60dp"
                  android:layout_height="60dp"
                  android:layout_centerInParent="true"
                  android:layout_marginLeft="50dp"
                  android:layout_marginRight="50dp" /&gt;
              &lt;Button
                  android:id="@+id/btn_qr"
                  android:layout_width="30dp"
                  android:layout_height="30dp"
                  android:layout_marginTop="30dp"
                  android:layout_toLeftOf="@+id/btn_orc"
                  android:layout_toStartOf="@+id/btn_orc"
                  android:background="@drawable/qr_scan" /&gt;
  
              &lt;Button
                  android:id="@+id/btn_orc"
                  android:layout_width="30dp"
                  android:layout_height="30dp"
                  android:layout_alignParentEnd="true"
                  android:layout_alignParentRight="true"
                  android:layout_marginLeft="7dp"
                  android:layout_marginRight="5dp"
                  android:layout_alignTop="@+id/btn_qr"
                  android:background="@drawable/bcr_scan"
                  tools:ignore="RtlHardcoded" /&gt;
  
   &lt;/RelativeLayout&gt;
  
      &lt;/RelativeLayout&gt;
  
  &lt;/FrameLayout&gt;</code></pre>
  </div>
  </div>
  </p>