Image Picker

Image handling in Ionic Apps. Learn how we manage images in Ion2FullApp Ionic Template. Image Picker and Image Cropper for Ionic.

We included a functionality to allow the user to pick an image from the phone’s gallery and to crop it. We placed this in the Profile under the “Change profile picture” and also in the Form examples.

You can see the code in src/pages/settings/settings.ts in openImagePicker method.

As we speak, there’s an issue in the original Image Picker plugin, so we made a fork of the repo and fixed it so you will not have any problem.

$ ionic cordova plugin add cordova-plugin-telerik-imagepicker --variable PHOTO_LIBRARY_USAGE_DESCRIPTION="your usage message"

Furthermore, we use the following plugin to select what part of the photo we want to show:

$ ionic cordova plugin add --save cordova-plugin-crop
$ npm install --save @ionic-native/crop

On Android 6 you need to request permission to read external storage at runtime when targeting API level 23+. Even if the uses-permission tags for the Calendar are present in AndroidManifest.xml. You can read more about this here.

Note we already included this fix in the code, so you don’t have to worry about it.

Learn more about Image handling in ionic apps.