离子4-本机相机插件问题

Question

我已经用Ionic4开发了一个安卓应用程序。我正面临一些问题与Ionic本地相机插件。下面是我的代码。以下是我所面临的问题。如果相机插件，我正在使用的版本是"@ionic-native/camera": "^5.3.0",。

问题

1. 画廊不开放
2. 捕捉到的图像不会返回。
3. 拍照后应用程序崩溃

html

<img [src]="studentImage!==null ? studentImage: 'assets/icon/ic_avatar.png'" class="add-picture" (click)="addImage()">

.ts

 public addImage() {
    this.genericServices.presentActionSheet(this.openGallery, this.openCamera);
  }

private openCamera = () => {
    this.studentImage = this.genericServices.selectPicture('camera');
    console.log('Captured Image:=>' + this.studentImage);
  }
  private openGallery() {
    this.studentImage = this.genericServices.selectPicture('gallery');
  }

服务

  public async selectPicture(source) {
    let base64Image = null;
    const cameraOptions: CameraOptions = {
      quality: 75,
      destinationType: this.camera.DestinationType.DATA_URL,
      encodingType: this.camera.EncodingType.PNG,
      mediaType: this.camera.MediaType.PICTURE,
      sourceType: source === 'camera' ? this.camera.PictureSourceType.CAMERA : this.camera.PictureSourceType.PHOTOLIBRARY,
      correctOrientation: true
    };

    await this.camera.getPicture(cameraOptions).then((imageData) => {
      console.log('Returned Image=>' + base64Image);
      return base64Image = 'data:image/jpeg;base64,' + imageData;
    }).catch(() => {
    });
  }

Answer 1

很难说你的问题是什么。我可能会编写稍微不同的代码，如下所示：

async selectImage() {

    const actionSheet = await this.actionCtrl.create({
        header: "Select Image source",
        buttons: [{
                text: 'Load from Library',
                handler: () => {
                  this.takePicture(this.camera.PictureSourceType.PHOTOLIBRARY);
                }
            },
            {
                text: 'Use Camera',
                handler: () => {
                    this.takePicture(this.camera.PictureSourceType.CAMERA);
                }
            },
            {
                text: 'Cancel',
                role: 'cancel'
            }
        ]
    });
    await actionSheet.present(); 
    }

然后在takePicture()方法中决定什么是destinationType，默认值是FILE_URI (1)。

 takePicture(sourceType: PictureSourceType) {
    var options: CameraOptions = {
        quality: 80,
        sourceType: sourceType,
        saveToPhotoAlbum: false,
        correctOrientation: true,
        destinationType: 1,
        targetWidth: 1240,
        targetHeight: 768,
    };
    this.camera.getPicture(options)
    .then((imageData) => {
      // do something with the imageData, should be able to bind it to a variable and 
      // show it in your html file. You might need to fix file path, 
      // remember to import private win: any = window, and use it like this.

      this.imagePreview = this.win.Ionic.WebView.convertFileSrc(imageData);

    }).catch((err) => {
      console.warn("takePicture Error: " + err);
    });
  }

这应该很好..。我刚刚测试过了。但就像我说的，你的设置可能有几处问题。希望能在某种程度上有所帮助..。否则，创建一个小提琴，我将很高兴地为您查看代码。