Save image in Photo Galery

Ionic Native
1

Hi I have a working Camera in ionic 3.
How can I save a taken picture into the foto gallery of a handy.
I’m using iOS.

Code cam.ts:

import { Component } from ‘@angular/core’;
import { NavController } from ‘ionic-angular’;
import { Camera, CameraOptions } from ‘@ionic-native/camera’
@Component({
selector: ‘page-home’,
templateUrl: ‘home.html’
})
export class HomePage {

options: CameraOptions = {
quality: 100,
destinationType: this.camera.DestinationType.DATA_URL,
encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE,
cameraDirection:0
}

clickedImagePath: any;

constructor(
public navCtrl: NavController,
private camera: Camera
) {

}
clickImage(){
this.camera.getPicture(this.options).then((imageData) => {
// imageData is either a base64 encoded string or a file URI
// If it’s base64 (DATA_URL):
let base64Image = ‘data:image/jpeg;base64,’ + imageData;
this.clickedImagePath = ‘data:image/jpeg;base64,’ + imageData;
}, (err) => {
// Handle error
});
}
}

Thanks

If you shoot a picture it’s displayd at the cam.html

PS: Sorry for my bad english

2

You can add

saveToPhotoAlbum: true

to your CameraOptions.

1 Like
3

It doesen’t work.
Everytime the Ionic Devapp on my handy just crashes.

4

Does it crash the moment you inserted this code?

saveToPhotoAlbum: true

OR
It crashes even before when you still didn’t insert the code?

5

I doubblechecked it when it’s:

options: CameraOptions = {
quality: 100,
destinationType: this.camera.DestinationType.DATA_URL,

encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE,
cameraDirection: 0,

}

it works.

And when it’s:

options: CameraOptions = {
quality: 100,
destinationType: this.camera.DestinationType.DATA_URL,
saveToPhotoAlbum: true,
encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE,
cameraDirection: 0
}

It crashes

Have I put the ‘saveToPhotoAlbum: true’ at the right place?

This is my first Application.
I code it for school, as a project.

6

It is correct. Can you please change destinationType: this.camera.DestinationType.DATA_URL to destinationType: this.camera.DestinationType.FILE_URI?

Then run it again. :blush:

7

It still doesn’t work but I think ( I don’t know for sure) the problem is now this part:

clickImage(){
this.camera.getPicture(this.options).then((imageData) => {
// imageData is either a base64 encoded string or a file URI
// If it’s base64 (DATA_URL):
let base64Image = ‘data:image/jpeg;base64,’ + imageData;
this.clickedImagePath = ‘data:image/jpeg;base64,’ + imageData;
}, (err) => {
// Handle error
});
}

base64image is for DATA_URL
is there something for FILE_URI

8

I don’t know what’s exactly the problem with your code. Here is my working code that you can use as a reference :blush:


    const options: CameraOptions = {
      quality: 100,
      destinationType: this.camera.DestinationType.FILE_URI,
      encodingType: this.camera.EncodingType.JPEG,
      mediaType: this.camera.MediaType.PICTURE,
      saveToPhotoAlbum: true
    }
    
    this.camera.getPicture(options).then((imageData) => {
     let base64Image = 'data:image/jpeg;base64,' + imageData;
     this.clickedImagePath = imageData;
    }, (err) => {
      this.toastCtrl.presentToast(err);
    });

Hope this helps :blush: