Question

如何从IONIC 3中的图库中拍摄图像？

我无法使用

从图库中拍摄图像

https://ionicframework.com/docs/native/camera/

https://ionicframework.com/docs/native/camera-preview/

Answer 1

.TS

 //take Photo
  takePhoto(sourceType:number) {
    const options: CameraOptions = {
      quality: 50,
      destinationType: this.camera.DestinationType.DATA_URL,
      encodingType: this.camera.EncodingType.JPEG,
      mediaType: this.camera.MediaType.PICTURE,
      correctOrientation: true,
      sourceType:sourceType,
    }

    this.camera.getPicture(options).then((imageData) => {
      let base64Image = 'data:image/jpeg;base64,' + imageData;
    }, (err) => {
      // Handle error
    });
  }

注意：您只需要调用以上方法：

this.takePhoto(0);//photo library

this.takePhoto(1);//camera

对0

的photo library 1

Camera

UI

Answer 2

在获得最多投票的答案之后，快速摘录。

定义2个选项类型：

  private optionsCamera: CameraOptions = {
    quality: 100,
    targetWidth: 600,
    sourceType: this.camera.PictureSourceType.CAMERA,
    destinationType: this.camera.DestinationType.DATA_URL,
    encodingType: this.camera.EncodingType.JPEG,
    mediaType: this.camera.MediaType.PICTURE
  }

  private optionsGallery: CameraOptions = {
    quality: 100,
    sourceType: this.camera.PictureSourceType.PHOTOLIBRARY,
    destinationType: this.camera.DestinationType.DATA_URL,
    encodingType: this.camera.EncodingType.JPEG,
    mediaType: this.camera.MediaType.PICTURE
  }

，当您调用自己的方法从相机获取图片

在适当情况下替换选项对象。

这是给相机的

this.camera.getPicture(this.optionsCamera).then((imageData) => {
  let base64Image = 'data:image/jpeg;base64,' + imageData;
 }, (err) => {
  // Handle error
  console.log(err)
 })

这是给画廊的

this.camera.getPicture(this.optionsGallery).then((imageData) => {
  let base64Image = 'data:image/jpeg;base64,' + imageData;
 }, (err) => {
  // Handle error
  console.log(err)
 })

Answer 3

试试这个：

TakeCamera() {
    const options: CameraOptions = {
      quality: 100,
      destinationType: this.camera.DestinationType.DATA_URL,
      encodingType: this.camera.EncodingType.JPEG,
      mediaType: this.camera.MediaType.PICTURE
    }
    this.camera.getPicture(options).then((imageData) => {
      this.base64Image = 'data:image/jpeg;base64,' + imageData;
      this.photos.push(this.base64Image);
      this.photos.reverse();
    }, (err) => {
      console.log(err);
    });
  }

Answer 4

使用图像选择器插件：

getImage(){
let options = {
maximumImagesCount:1//select number of image default is 15
}
this.imagePicker.getPictures(options).then((results) => {
  for (var i = 0; i < results.length; i++) {
      console.log('Image URI: ' + results[i]);
  }
}, (err) => {
console.log("error: "+err); 
});
}

参考image picker

如何从IONIC 3中的图库中选择图像

4 个答案: