CODEWITHSUNDEEP
angularionic-frameworkionic4
Ram
Ram

Reputation: 611

How to save picture using ionic camera preview

I'm developing a mobile application using Ionic 4. Everything is working smoothly, but i could not save the picture when i call the function takePicture(). Does it have any parameters like saveToPhotoAlbum in Ionic Camera Plugin. Do help me out.

  cameraPictureOpts: CameraPreviewPictureOptions = {
    width: window.innerWidth,
    height: window.innerHeight,
    quality: 100
  }

  takePicture() {
    let result = this.cameraPreview.takePicture(this.cameraPictureOpts);
    let picture = `data:image/jpeg;base64,${result}`;
  }

Upvotes: 0

Views: 2376

Answers (2)

María Cristina Fernández López
María Cristina Fernández López

Reputation: 437

You can save the image in a local variable. 

selectedImage: any; 

pictureOpts: CameraPreviewPictureOptions = {
    width: 400,
    height: 400,
    quality: 85
};

............


takePicture() {
    console.log('take pinture');
    // take a picture
    this.cameraPreview.takePicture(this.pictureOpts).then((imageData) => {
      this.selectedImage = 'data:image/jpeg;base64,' + imageData;
      console.log('take picture ');
      this.location.back(); // go to previous page
    }, (err) => {
      console.log(err);
      this.selectedImage = 'assets/img/test.jpg';
    });
  }`

Once saved in the variable you can save it to the phone, for example using NativeStorage.

import { NativeStorage } from '@ionic-native/native-storage/ngx';

 constructor(private storage: NativeStorage) {}

saveImage() {
    this.storage.setItem('image', {property: this.selectedImage})
              .then(
                  () => {
                    console.log('Stored image!');
                  },
                  error => {
                    console.error('Error guardando la imagen', error);
                  }
          );
}

Upvotes: 1

Ranika Nisal
Ranika Nisal

Reputation: 980

The ionic/native CameraPlugin .takePicture() method returns a promise. To get the value you need to change your code a bit.

  takePicture() {
    this.cameraPreview.takePicture(this.cameraPictureOpts).then(data => {
         let picture = `data:image/jpeg;base64,` + data;
    });

  }

Upvotes: 0

Related Questions