In this tutorial we’ll develop an application that picks an image from camera or gallery and display that in an ImageView.
Note: The below code works fine for pre-Android Nougat versions. For the latest working example check out the updated article.
Android Capture Image Overview
With the commence of Android Marshmallow, runtime permissions need to be implemented forefront.
Add the following permissions in the Android Manifest.xml file, above the application tag.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<uses-feature android:name="android.hardware.camera" android:required="false" /> <uses-feature android:name="android.hardware.camera.autofocus" android:required="false" /> <uses-feature android:name="android.hardware.camera.flash" android:required="false" /> <uses-permission android:name="android.permission.CAMERA" /> <uses-permission android:name="ANDROID.PERMISSION.READ_EXTERNAL_STORAGE"/> |
By adding android.hardware.camera, Play Store detects and prevents installing the application on devices with no camera.
Intent is the standard way to delegate actions to another application.
To start the native camera the Intent requires android.provider.MediaStore.ACTION_IMAGE_CAPTURE.
To choose an image from gallery, the Intent requires the following argument : Intent.ACTION_GET_CONTENT.
In this tutorial we’ll be invoking an image picker, that lets us select an image from camera or gallery and displays the image in a circular image view and a normal image view. Add the following dependency inside the build.gradle file.
compile 'de.hdodenhof:circleimageview:2.1.0'
Android Image Capture Project Structure
Android Capture Image Code
The layout for the activity_main.xml stays the same barring the icon change for the FAB button to @android:drawable/ic_menu_camera.
The content_main.xml is given below:
|
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 |
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android" xmlns:app="https://schemas.android.com/apk/res-auto" xmlns:tools="https://schemas.android.com/tools" android:id="@+id/content_main" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:background="#000000" app:layout_behavior="@string/appbar_scrolling_view_behavior" tools:context="com.journaldev.imagepicker.MainActivity" tools:showIn="@layout/activity_main"> <RelativeLayout android:layout_width="250dp" android:layout_height="250dp" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:background="@drawable/image_border" android:clickable="true" android:orientation="vertical"> <ImageView android:id="@+id/imageView" android:layout_width="match_parent" android:layout_height="match_parent" android:adjustViewBounds="true" android:scaleType="centerCrop" /> </RelativeLayout> <de.hdodenhof.circleimageview.CircleImageView android:id="@+id/img_profile" android:layout_width="100dp" android:layout_height="100dp" android:layout_gravity="center_horizontal" android:src="https://www.journaldev.com/13270/@drawable/profile" app:civ_border_width="5dp" app:civ_border_color="#FFFFFF" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" /> </RelativeLayout> |
The code for the MainActivity.java is given below
|
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 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 |
public class MainActivity extends AppCompatActivity { Bitmap myBitmap; Uri picUri; private ArrayList permissionsToRequest; private ArrayList permissionsRejected = new ArrayList(); private ArrayList permissions = new ArrayList(); private final static int ALL_PERMISSIONS_RESULT = 107; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab); fab.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { startActivityForResult(getPickImageChooserIntent(), 200); } }); permissions.add(CAMERA); permissionsToRequest = findUnAskedPermissions(permissions); //get the permissions we have asked for before but are not granted.. //we will store this in a global list to access later. if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) { if (permissionsToRequest.size() > 0) requestPermissions(permissionsToRequest.toArray(new String[permissionsToRequest.size()]), ALL_PERMISSIONS_RESULT); } } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.menu_main, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { // Handle action bar item clicks here. The action bar will // automatically handle clicks on the Home/Up button, so long // as you specify a parent activity in AndroidManifest.xml. int id = item.getItemId(); //noinspection SimplifiableIfStatement if (id == R.id.action_settings) { return true; } return super.onOptionsItemSelected(item); } /** * Create a chooser intent to select the source to get image from.<br /> * The source can be camera's (ACTION_IMAGE_CAPTURE) or gallery's (ACTION_GET_CONTENT).<br /> * All possible sources are added to the intent chooser. */ public Intent getPickImageChooserIntent() { // Determine Uri of camera image to save. Uri outputFileUri = getCaptureImageOutputUri(); List allIntents = new ArrayList(); PackageManager packageManager = getPackageManager(); // collect all camera intents Intent captureIntent = new Intent(android.provider.MediaStore.ACTION_IMAGE_CAPTURE); List listCam = packageManager.queryIntentActivities(captureIntent, 0); for (ResolveInfo res : listCam) { Intent intent = new Intent(captureIntent); intent.setComponent(new ComponentName(res.activityInfo.packageName, res.activityInfo.name)); intent.setPackage(res.activityInfo.packageName); if (outputFileUri != null) { intent.putExtra(MediaStore.EXTRA_OUTPUT, outputFileUri); } allIntents.add(intent); } // collect all gallery intents Intent galleryIntent = new Intent(Intent.ACTION_GET_CONTENT); galleryIntent.setType("image/*"); List listGallery = packageManager.queryIntentActivities(galleryIntent, 0); for (ResolveInfo res : listGallery) { Intent intent = new Intent(galleryIntent); intent.setComponent(new ComponentName(res.activityInfo.packageName, res.activityInfo.name)); intent.setPackage(res.activityInfo.packageName); allIntents.add(intent); } // the main intent is the last in the list (fucking android) so pickup the useless one Intent mainIntent = allIntents.get(allIntents.size() - 1); for (Intent intent : allIntents) { if (intent.getComponent().getClassName().equals("com.android.documentsui.DocumentsActivity")) { mainIntent = intent; break; } } allIntents.remove(mainIntent); // Create a chooser from the main intent Intent chooserIntent = Intent.createChooser(mainIntent, "Select source"); // Add all other intents chooserIntent.putExtra(Intent.EXTRA_INITIAL_INTENTS, allIntents.toArray(new Parcelable[allIntents.size()])); return chooserIntent; } /** * Get URI to image received from capture by camera. */ private Uri getCaptureImageOutputUri() { Uri outputFileUri = null; File getImage = getExternalCacheDir(); if (getImage != null) { outputFileUri = Uri.fromFile(new File(getImage.getPath(), "profile.png")); } return outputFileUri; } @Override protected void onActivityResult(int requestCode, int resultCode, Intent data) { Bitmap bitmap; if (resultCode == Activity.RESULT_OK) { ImageView imageView = (ImageView) findViewById(R.id.imageView); if (getPickImageResultUri(data) != null) { picUri = getPickImageResultUri(data); try { myBitmap = MediaStore.Images.Media.getBitmap(this.getContentResolver(), picUri); myBitmap = rotateImageIfRequired(myBitmap, picUri); myBitmap = getResizedBitmap(myBitmap, 500); CircleImageView croppedImageView = (CircleImageView) findViewById(R.id.img_profile); croppedImageView.setImageBitmap(myBitmap); imageView.setImageBitmap(myBitmap); } catch (IOException e) { e.printStackTrace(); } } else { bitmap = (Bitmap) data.getExtras().get("data"); myBitmap = bitmap; CircleImageView croppedImageView = (CircleImageView) findViewById(R.id.img_profile); if (croppedImageView != null) { croppedImageView.setImageBitmap(myBitmap); } imageView.setImageBitmap(myBitmap); } } } private static Bitmap rotateImageIfRequired(Bitmap img, Uri selectedImage) throws IOException { ExifInterface ei = new ExifInterface(selectedImage.getPath()); int orientation = ei.getAttributeInt(ExifInterface.TAG_ORIENTATION, ExifInterface.ORIENTATION_NORMAL); switch (orientation) { case ExifInterface.ORIENTATION_ROTATE_90: return rotateImage(img, 90); case ExifInterface.ORIENTATION_ROTATE_180: return rotateImage(img, 180); case ExifInterface.ORIENTATION_ROTATE_270: return rotateImage(img, 270); default: return img; } } private static Bitmap rotateImage(Bitmap img, int degree) { Matrix matrix = new Matrix(); matrix.postRotate(degree); Bitmap rotatedImg = Bitmap.createBitmap(img, 0, 0, img.getWidth(), img.getHeight(), matrix, true); img.recycle(); return rotatedImg; } public Bitmap getResizedBitmap(Bitmap image, int maxSize) { int width = image.getWidth(); int height = image.getHeight(); float bitmapRatio = (float) width / (float) height; if (bitmapRatio > 0) { width = maxSize; height = (int) (width / bitmapRatio); } else { height = maxSize; width = (int) (height * bitmapRatio); } return Bitmap.createScaledBitmap(image, width, height, true); } /** * Get the URI of the selected image from {@link #getPickImageChooserIntent()}.<br /> * Will return the correct URI for camera and gallery image. * * @param data the returned data of the activity result */ public Uri getPickImageResultUri(Intent data) { boolean isCamera = true; if (data != null) { String action = data.getAction(); isCamera = action != null && action.equals(MediaStore.ACTION_IMAGE_CAPTURE); } return isCamera ? getCaptureImageOutputUri() : data.getData(); } @Override protected void onSaveInstanceState(Bundle outState) { super.onSaveInstanceState(outState); // save file url in bundle as it will be null on scren orientation // changes outState.putParcelable("pic_uri", picUri); } @Override protected void onRestoreInstanceState(Bundle savedInstanceState) { super.onRestoreInstanceState(savedInstanceState); // get the file url picUri = savedInstanceState.getParcelable("pic_uri"); } private ArrayList findUnAskedPermissions(ArrayList wanted) { ArrayList result = new ArrayList(); for (String perm : wanted) { if (!hasPermission(perm)) { result.add(perm); } } return result; } private boolean hasPermission(String permission) { if (canMakeSmores()) { if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) { return (checkSelfPermission(permission) == PackageManager.PERMISSION_GRANTED); } } return true; } private void showMessageOKCancel(String message, DialogInterface.OnClickListener okListener) { new AlertDialog.Builder(this) .setMessage(message) .setPositiveButton("OK", okListener) .setNegativeButton("Cancel", null) .create() .show(); } private boolean canMakeSmores() { return (Build.VERSION.SDK_INT > Build.VERSION_CODES.LOLLIPOP_MR1); } @TargetApi(Build.VERSION_CODES.M) @Override public void onRequestPermissionsResult(int requestCode, String[] permissions, int[] grantResults) { switch (requestCode) { case ALL_PERMISSIONS_RESULT: for (String perms : permissionsToRequest) { if (hasPermission(perms)) { } else { permissionsRejected.add(perms); } } if (permissionsRejected.size() > 0) { if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) { if (shouldShowRequestPermissionRationale(permissionsRejected.get(0))) { showMessageOKCancel("These permissions are mandatory for the application. Please allow access.", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) { //Log.d("API123", "permisionrejected " + permissionsRejected.size()); requestPermissions(permissionsRejected.toArray(new String[permissionsRejected.size()]), ALL_PERMISSIONS_RESULT); } } }); return; } } } break; } } } |
There are a lot of inferences to be drawn from the code above.
- We need to ask for the Camera runtime permissions when the user starts the activity.
- As we are starting the intent to get some result back, we need to call startActivityForResult with the relevant arguments
- Instead of using a dialog to separately call the Intents for Camera and Gallery, we’ve used a method getPickImageChooserIntent() that creates a single chooser intent for all the camera and gallery intents(note the documents intent). Intent.EXTRA_INITIAL_INTENTS is used to add the multiple application intents at one place
- For the camera intent, MediaStore.EXTRA_OUTPUT is passed as an extra to specify the image storage path. Without this you’ll be returned only a small resolution image.
- The URI path for the image returned by camera is fetched inside the method
getCaptureImageOutputUri(). - The onActivityResult essentially returns a URI to the image. Some devices do return the bitmap as
data.getExtras().get("data");. - When an image is clicked, the camera screen while returning restarts the activity thereby causing the URI stored from the method
getCaptureImageOutputUri()to become null.
Hence it’s essential that we store and restore that URI usingonSaveInstanceState()andonRestoreInstanceState(). - The bitmap is retrieved from the URI in the following line of code.
myBitmap = MediaStore.Images.Media.getBitmap(this.getContentResolver(), picUri); - Devices like Samsung galaxy are known to capture the image in landscape orientation. Retrieving the image and displaying as it is can cause it to be displayed in the wrong orientation. Hence we’ve called the method
rotateImageIfRequired(myBitmap, picUri); - ExifInterface is a class for reading and writing Exif tags in a JPEG file or a RAW image file.
- In the end we call the method getResizedBitmap() to scale the bitmap by width or height(whichever is larger) and set the image to the image view using setImageBitmap.
The output of the application in action is given below. Note: To capture and display an image from camera you’ll need to run the application on a smartphone for obvious reasons.
This brings an end to this tutorial. You can download the Android project for Image Capture from the link below.