SurfaceView is a class provided by android.view package. It offers a dedicated drawing surface embedded inside of a view hierarchy. We can manage the format of this surface, however, the SurfaceView takes care of putting the surface at the right location on the screen.
In this post, we will use the SurfaceView to preview the camera (android.hardware.camera) onto the screen and capture images using it.
First let us create a new project and add the following dependencies in your app level build.gradle file which is available at location: app/build.gradle.
1 2 3 4 |
dependencies { /*... other dependencies ...*/ implementation 'com.google.android.gms:play-services-vision:17.0.2' } |
In the AndroidManifest.xml file, add the following permission.
1 |
<uses-permission android:name="android.permission.CAMERA" /> |
We will also be needing the real-time permission check for android version M and above. Add the below code in your MainActivity.java for handling these checks.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 |
import android.content.DialogInterface; import android.content.pm.PackageManager; import android.os.Bundle; import android.support.annotation.NonNull; import android.support.v4.app.ActivityCompat; import android.support.v4.content.ContextCompat; import android.support.v7.app.AlertDialog; import android.support.v7.app.AppCompatActivity; import android.widget.Toast; import java.util.ArrayList; import static android.Manifest.permission.CAMERA; public class MainActivity extends AppCompatActivity { private String[] neededPermissions = new String[]{CAMERA}; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); boolean result = checkPermission(); if (result) { /* Code after permission granted */ } } private boolean checkPermission() { ArrayList<String> permissionsNotGranted = new ArrayList<>(); for (String permission : neededPermissions) { if (ContextCompat.checkSelfPermission(this, permission) != PackageManager.PERMISSION_GRANTED) { permissionsNotGranted.add(permission); } } if (!permissionsNotGranted.isEmpty()) { boolean shouldShowAlert = false; for (String permission : permissionsNotGranted) { shouldShowAlert = ActivityCompat.shouldShowRequestPermissionRationale(this, permission); } if (shouldShowAlert) { showPermissionAlert(permissionsNotGranted.toArray(new String[0])); } else { requestPermissions(permissionsNotGranted.toArray(new String[0])); } return false; } return true; } private void showPermissionAlert(final String[] permissions) { AlertDialog.Builder alertBuilder = new AlertDialog.Builder(this); alertBuilder.setCancelable(true); alertBuilder.setTitle("Permission Required"); alertBuilder.setMessage("Camea permission is required to move forward."); alertBuilder.setPositiveButton(android.R.string.yes, new DialogInterface.OnClickListener() { public void onClick(DialogInterface dialog, int which) { requestPermissions(permissions); } }); AlertDialog alert = alertBuilder.create(); alert.show(); } private void requestPermissions(String[] permissions) { ActivityCompat.requestPermissions(MainActivity.this, permissions, 1001); } @Override public void onRequestPermissionsResult(int requestCode, @NonNull String[] permissions, @NonNull int[] grantResults) { if (requestCode == 1001) { for (int result : grantResults) { if (result == PackageManager.PERMISSION_DENIED) { Toast.makeText(MainActivity.this, "This permission is required", Toast.LENGTH_LONG).show(); checkPermission(); return; } } /* Code after permission granted */ } super.onRequestPermissionsResult(requestCode, permissions, grantResults); } } |
Now let’s build our layout file. So open activity_main.xml file and add the below code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <SurfaceView android:id="@+id/surfaceView" android:layout_width="match_parent" android:layout_height="match_parent" android:visibility="gone" /> <TextView android:id="@+id/tv_capture" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal|bottom" android:background="#8cffffff" android:padding="20dp" android:text="Click" android:textStyle="bold" android:visibility="gone" /> <ImageView android:id="@+id/iv_picture" android:layout_width="match_parent" android:layout_height="match_parent" android:visibility="gone" /> </FrameLayout> |
Now in MainActivity.java, let us set up our implementation for SurfaceView.
To initialize SurfaceView, use the following code :
1 2 |
private SurfaceView surfaceView; surfaceView = findViewById(R.id.surfaceView); |
Now to setup SurfaceHolder, we need to first create a FaceDetector object.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
private FaceDetector detector; detector = new FaceDetector.Builder(this) .setProminentFaceOnly(true) // optimize for single, relatively large face .setTrackingEnabled(true) // enable face tracking .setClassificationType(/* eyes open and smile */ FaceDetector.ALL_CLASSIFICATIONS) .setMode(FaceDetector.FAST_MODE) // for one face this is OK .build(); // Check if detector has been initialized properly if (!detector.isOperational()) { Log.w("MainActivity", "Detector Dependencies are not yet available"); } else { Log.w("MainActivity", "Detector Dependencies are available"); /* Check camera permission here */ } |
Now setup SurfaceHolder and add a callback to it.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
private CameraSource cameraSource; private void setupSurfaceHolder() { cameraSource = new CameraSource.Builder(this, detector) .setFacing(CameraSource.CAMERA_FACING_FRONT) .setRequestedFps(2.0f) .setAutoFocusEnabled(true) .build(); surfaceHolder = surfaceView.getHolder(); surfaceHolder.addCallback(new SurfaceHolder.Callback() { @Override public void surfaceCreated(SurfaceHolder holder) { try { cameraSource.start(surfaceHolder); detector.setProcessor(new LargestFaceFocusingProcessor(detector, new Tracker<Face>())); } catch (IOException e) { e.printStackTrace(); } } @Override public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) { } @Override public void surfaceDestroyed(SurfaceHolder holder) { cameraSource.stop(); } }); } |
Now to click the picture, we need to setup OnClickListener to click the picture and display it.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
findViewById(R.id.tv_capture).setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { clickImage(); } }); private void clickImage() { if (cameraSource != null) { cameraSource.takePicture(/*shutterCallback*/null, new CameraSource.PictureCallback() { @Override public void onPictureTaken(byte[] bytes) { Bitmap bitmap = BitmapFactory.decodeByteArray(bytes, 0, bytes.length); ((ImageView) findViewById(R.id.iv_picture)).setImageBitmap(bitmap); setViewVisibility(R.id.iv_picture); findViewById(R.id.surfaceView).setVisibility(View.GONE); findViewById(R.id.tv_capture).setVisibility(View.GONE); } }); } } |
Below is the complete code for MainActivity.java.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 |
import android.content.DialogInterface; import android.content.pm.PackageManager; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.os.Bundle; import android.support.annotation.NonNull; import android.support.v4.app.ActivityCompat; import android.support.v4.content.ContextCompat; import android.support.v7.app.AlertDialog; import android.support.v7.app.AppCompatActivity; import android.util.Log; import android.view.SurfaceHolder; import android.view.SurfaceView; import android.view.View; import android.widget.ImageView; import android.widget.Toast; import com.google.android.gms.vision.CameraSource; import com.google.android.gms.vision.Tracker; import com.google.android.gms.vision.face.Face; import com.google.android.gms.vision.face.FaceDetector; import com.google.android.gms.vision.face.LargestFaceFocusingProcessor; import java.io.IOException; import java.util.ArrayList; import static android.Manifest.permission.CAMERA; public class MainActivity extends AppCompatActivity { private String[] neededPermissions = new String[]{CAMERA}; private SurfaceView surfaceView; private CameraSource cameraSource; private SurfaceHolder surfaceHolder; private FaceDetector detector; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); surfaceView = findViewById(R.id.surfaceView); detector = new FaceDetector.Builder(this) .setProminentFaceOnly(true) // optimize for single, relatively large face .setTrackingEnabled(true) // enable face tracking .setClassificationType(/* eyes open and smile */ FaceDetector.ALL_CLASSIFICATIONS) .setMode(FaceDetector.FAST_MODE) // for one face this is OK .build(); if (!detector.isOperational()) { Log.w("MainActivity", "Detector Dependencies are not yet available"); } else { Log.w("MainActivity", "Detector Dependencies are available"); if (surfaceView != null) { boolean result = checkPermission(); if (result) { setViewVisibility(R.id.tv_capture); setViewVisibility(R.id.surfaceView); setupSurfaceHolder(); } } } findViewById(R.id.tv_capture).setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { clickImage(); } }); } private boolean checkPermission() { ArrayList<String> permissionsNotGranted = new ArrayList<>(); for (String permission : neededPermissions) { if (ContextCompat.checkSelfPermission(this, permission) != PackageManager.PERMISSION_GRANTED) { permissionsNotGranted.add(permission); } } if (!permissionsNotGranted.isEmpty()) { boolean shouldShowAlert = false; for (String permission : permissionsNotGranted) { shouldShowAlert = ActivityCompat.shouldShowRequestPermissionRationale(this, permission); } if (shouldShowAlert) { showPermissionAlert(permissionsNotGranted.toArray(new String[0])); } else { requestPermissions(permissionsNotGranted.toArray(new String[0])); } return false; } return true; } private void showPermissionAlert(final String[] permissions) { AlertDialog.Builder alertBuilder = new AlertDialog.Builder(this); alertBuilder.setCancelable(true); alertBuilder.setTitle("Permission Required"); alertBuilder.setMessage("Camea permission is required to move forward."); alertBuilder.setPositiveButton(android.R.string.yes, new DialogInterface.OnClickListener() { public void onClick(DialogInterface dialog, int which) { requestPermissions(permissions); } }); AlertDialog alert = alertBuilder.create(); alert.show(); } private void requestPermissions(String[] permissions) { ActivityCompat.requestPermissions(MainActivity.this, permissions, 1001); } @Override public void onRequestPermissionsResult(int requestCode, @NonNull String[] permissions, @NonNull int[] grantResults) { if (requestCode == 1001) { for (int result : grantResults) { if (result == PackageManager.PERMISSION_DENIED) { Toast.makeText(MainActivity.this, "This permission is required", Toast.LENGTH_LONG).show(); checkPermission(); return; } } setViewVisibility(R.id.tv_capture); setViewVisibility(R.id.surfaceView); setupSurfaceHolder(); } super.onRequestPermissionsResult(requestCode, permissions, grantResults); } private void setViewVisibility(int id) { View view = findViewById(id); if (view != null) { view.setVisibility(View.VISIBLE); } } private void setupSurfaceHolder() { cameraSource = new CameraSource.Builder(this, detector) .setFacing(CameraSource.CAMERA_FACING_FRONT) .setRequestedFps(2.0f) .setAutoFocusEnabled(true) .build(); surfaceHolder = surfaceView.getHolder(); surfaceHolder.addCallback(new SurfaceHolder.Callback() { @Override public void surfaceCreated(SurfaceHolder holder) { try { cameraSource.start(surfaceHolder); detector.setProcessor(new LargestFaceFocusingProcessor(detector, new Tracker<Face>())); } catch (IOException e) { e.printStackTrace(); } } @Override public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) { } @Override public void surfaceDestroyed(SurfaceHolder holder) { cameraSource.stop(); } }); } private void clickImage() { if (cameraSource != null) { cameraSource.takePicture(/*shutterCallback*/null, new CameraSource.PictureCallback() { @Override public void onPictureTaken(byte[] bytes) { Bitmap bitmap = BitmapFactory.decodeByteArray(bytes, 0, bytes.length); ((ImageView) findViewById(R.id.iv_picture)).setImageBitmap(bitmap); setViewVisibility(R.id.iv_picture); findViewById(R.id.surfaceView).setVisibility(View.GONE); findViewById(R.id.tv_capture).setVisibility(View.GONE); } }); } } } |
That’s all for this post. Stay tuned for the next post to learn how to click the picture on the blinking of your eyes.
InnovationM is a globally renowned Android app development company in India that caters to a strong & secure Android app development, iOS app development, hybrid app development services. Our commitment & engagement towards our target gives us brighter in the world of technology and has led us to establish success stories consecutively which makes us the best iOS app development company in India.
Thanks for giving your valuable time. Keep reading and keep learning 🙂