使用camera preview
插件,一切正常,除了每当我在Ionic 4中使用cameraPreview.stopCamera()
功能关闭相机预览时,屏幕都变黑。
如何在第三张屏幕截图中删除黑屏。
下面附有屏幕截图,以更好地了解问题。
以下是参考代码 camera-preview.ts文件
constructor(
private router: Router,
private customizeCameraService: CustomizeCameraService
) {
}
ionViewWillEnter() {
this.openCamera();
}
ionViewWillLeave() {
this.customizeCameraService.stopCamera();
}
openCamera() {
this.customizeCameraService.openCameraPreview().then(
(res) => {
this.isCameraOpen = true;
this.showIcons = true;
},
(err) => {
if (err === 'Illegal access') {
this.router.navigate(['/tabs']);
}
}
);
}
takePicture(captureType: string) {
this.customizeCameraService.takePicture().then(
(imageData) => {
this.customizeCameraService.stopCamera().then(
(res) => {
this.picture = 'data:image/jpeg;base64,' + imageData;
this.isCameraOpen = false;
},
(err) => {
console.log(err);
}
);
},
(err) => {
console.log(err);
}
);
}
camera-preview.scss文件
ion-content,
ion-header,
.nav-decor {
--background: transparent !important;
}
camera-preview-service.ts文件
cameraPreviewOpts: CameraPreviewOptions = {
x: 0,
y: 0,
width: window.screen.width,
height: window.screen.height,
camera: this.cameraPreview.CAMERA_DIRECTION.BACK,
tapPhoto: true,
previewDrag: false,
toBack: true,
};
// Take picture options
pictureOpts: CameraPreviewPictureOptions = {
width: 360,
height: 640,
quality: 85
};
constructor(
@Inject(CameraPreview) public cameraPreview: CameraPreview
) { }
openCameraPreview(): Promise<any> {
return this.cameraPreview.startCamera(this.cameraPreviewOpts);
}
takePicture(): Promise<any> {
return this.cameraPreview.takePicture(this.pictureOpts);
}
stopCamera(): Promise<any> {
return this.cameraPreview.stopCamera();
}