Camera Preview
Showing camera preview in HTML
Requires Cordova plugin: https://github.com/cordova-plugin-camera-preview/cordova-plugin-camera-preview.git. For more info, please see the
Cordova Camera Preview docs.
Cordovaの問題で困っていますか?
本格的なプロジェクトを構築している場合、トラブルシューティングに時間を費やす余裕はありません。Ionicのエキスパートが、保守、サポート、統合に関する公式サポートを提供しています。
インストール
Ionic Native Enterprise はIonic Teamが完全にサポートしメンテナンスしているプラグインを利用できます。 詳しくみる か、 エンタープライズプラグインに興味があれば 連絡ください
サポートしているプラットフォーム
- Android
- iOS
利用方法
React
Angular
import { CameraPreview, CameraPreviewPictureOptions, CameraPreviewOptions, CameraPreviewDimensions } from '@ionic-native/camera-preview/ngx';
constructor(private cameraPreview: CameraPreview) { }
...
// camera options (Size and location). In the following example, the preview uses the rear camera and display the preview in the back of the webview
const cameraPreviewOpts: CameraPreviewOptions = {
x: 0,
y: 0,
width: window.screen.width,
height: window.screen.height,
camera: 'rear',
tapPhoto: true,
previewDrag: true,
toBack: true,
alpha: 1
}
// start camera
this.cameraPreview.startCamera(cameraPreviewOpts).then(
(res) => {
console.log(res)
},
(err) => {
console.log(err)
});
// Set the handler to run every time we take a picture
this.cameraPreview.setOnPictureTakenHandler().subscribe((result) => {
console.log(result);
// do something with the result
});
// picture options
const pictureOpts: CameraPreviewPictureOptions = {
width: 1280,
height: 1280,
quality: 85
}
// take a picture
this.cameraPreview.takePicture(this.pictureOpts).then((imageData) => {
this.picture = 'data:image/jpeg;base64,' + imageData;
}, (err) => {
console.log(err);
this.picture = 'assets/img/test.jpg';
});
// take a snap shot
this.cameraPreview.takeSnapshot(this.pictureOpts).then((imageData) => {
this.picture = 'data:image/jpeg;base64,' + imageData;
}, (err) => {
console.log(err);
this.picture = 'assets/img/test.jpg';
});
// Switch camera
this.cameraPreview.switchCamera();
// set color effect to negative
this.cameraPreview.setColorEffect('negative');
// Stop the camera preview
this.cameraPreview.stopCamera();

