Guide
Comment utiliser Camera Preview dans Capacitor
Tester sur l'appareil
Téléchargez l'application Capgo, puis scannez le QR code.
Utilisation de @capgo/camera-preview
L'interface principale pour le plugin CameraPreview.
Installer
bun add @capgo/camera-preview
bunx cap sync
bunx cap sync copie le code natif du plugin dans vos projets natifs. Relancez-l’après chaque mise à jour du plugin.
Importer
import { CameraPreview } from '@capgo/camera-preview';
Aperçu de API
| Méthode | Description |
|---|---|
start |
Lance l'aperçu de la caméra. |
stop |
Arrête l'aperçu de la caméra. |
capture |
Capture une photo avec la caméra. |
captureSample |
Capture une seule image du flux de la preview caméra. |
startBarcodeScanner |
Lance le scan de codes-barres sur l'aperçu caméra actif. |
stopBarcodeScanner |
Arrête le scan de codes-barres tout en maintenant l'aperçu caméra. |
getSupportedFlashModes |
Récupère les modes de flash supportés par la caméra active. |
setAspectRatio |
Définit le ratio d'aspect de l'aperçu caméra. |
getAspectRatio |
Récupère le ratio d'aspect actuel de l'aperçu caméra. |
setGridMode |
Définit le mode grille de l'overlay de l'aperçu caméra. |
getGridMode |
Récupère le mode grille actuel de l'overlay de l'aperçu caméra. |
checkPermissions |
Vérifie l'état des permissions de la caméra (et optionnellement du micro) sans afficher la boîte de dialogue système. |
requestPermissions |
Demande les permissions de la caméra (et optionnellement du micro). Si les permissions sont déjà accordées ou refusées, le statut actuel est renvoyé sans prompt. Lorsque showSettingsAlert est vrai et que les permissions sont refusées, une alerte spécifique à la plateforme guidant l'utilisateur vers les réglages de l'application sera affichée. |
getHorizontalFov |
Récupère le champ de vision (FoV) horizontal de la caméra active. Note : cela peut être une estimation sur certains appareils. |
getSupportedPictureSizes |
Récupère les tailles d'image prises en charge pour toutes les caméras. |
setFlashMode |
Définit le mode flash de la caméra active. |
flip |
Bascule entre la caméra avant et la caméra arrière. |
setOpacity |
Définit l'opacité de l'aperçu de la caméra. |
stopRecordVideo |
Arrête l'enregistrement vidéo en cours. |
startRecordVideo |
Lance l'enregistrement d'une vidéo. |
setVideoQuality |
Définit la qualité d'enregistrement vidéo pour la session de la caméra active. |
getVideoQuality |
Récupère la qualité d'enregistrement vidéo actuelle. |
getSupportedVideoQualities |
Renvoie les qualités vidéo supportées par la caméra active. |
setVideoCodec |
Définit le codec vidéo utilisé lors de l'enregistrement. |
getVideoCodec |
Récupère le codec vidéo actuellement utilisé pour l'enregistrement. |
getSupportedVideoCodecs |
Renvoie les codecs vidéo supportés par la caméra active. |
isVideoStabilizationSupported |
Vérifie si la stabilisation vidéo est supportée par la caméra active. |
getSupportedVideoStabilizationModes |
Renvoie les modes de stabilisation vidéo supportés par la caméra active. |
getVideoStabilizationMode |
Récupère le mode de stabilisation vidéo actuel. |
setVideoStabilizationMode |
Définit le mode de stabilisation vidéo pour l'enregistrement. Impossible de le modifier pendant un enregistrement. Vous pouvez aussi passer des videoStabilizationMode dans startRecordVideo() options. |
isRunning |
Vérifie si l'aperçu de la caméra est actif. |
getAvailableDevices |
Récupère tous les appareils photo disponibles. |
getZoom |
Récupère l'état actuel du zoom, incluant le min/max et les infos sur l'objectif actuel. |
getZoomButtonValues |
Renvoie les valeurs du bouton de zoom pour un changement rapide. - iOS/Android : inclut 0,5 si l'ultra grand-angle est disponible ; 1 et 2 si le grand-angle est disponible ; 3 si le téléobjectif est disponible - Web : non pris en charge. |
setZoom |
Définit le niveau de zoom de la caméra. |
getFlashMode |
Récupère le mode flash actuel. |
setDeviceId |
Bascule la caméra active vers celle dont l'ID est spécifié deviceId. |
getDeviceId |
Récupère l'ID de l'appareil photo actuellement lié. Sur Android, si une requête pour un objectif physique bascule sur une caméra logique, cela renvoie l'ID de la caméra logique liée. |
getPreviewSize |
Récupère la taille et la position actuelles de l'aperçu. |
setPreviewSize |
Définit la taille et la position de l'aperçu. |
setFocus |
Définit la mise au point de la caméra sur un point spécifique de l'aperçu. |
deleteFile |
Supprime un fichier au chemin absolu donné sur l'appareil. Utilisez ceci pour nettoyer rapidement les images temporaires créées avec storeToFile. On web, this is not supported and will throw. |
getSafeAreaInsets |
Récupère les insets de la safe area pour les appareils. Renvoie l'inset de l'encoche/découpe caméra selon l'orientation et l'orientation actuelle. En mode portrait : renvoie l'inset du haut (encoche en haut). En mode paysage : renvoie l'inset de gauche (encoche sur le côté). Cela cible spécifiquement la zone de découpe (encoche, trou, etc.) présente sur tous les téléphones modernes. |
getOrientation |
Récupère l'orientation actuelle de l'appareil dans un format multiplateforme. |
getExposureModes |
Retourne les modes d'exposition pris en charge par la caméra active. Les modes peuvent inclure : 'locked', 'auto', 'continuous', 'custom'. |
getExposureMode |
Retourne le mode d'exposition actuel. |
setExposureMode |
Définit le mode d'exposition. |
getExposureCompensationRange |
Retourne la plage de compensation d'exposition (biais EV) prise en charge. |
getExposureCompensation |
Retourne la compensation d'exposition actuelle (biais EV). |
setExposureCompensation |
Définit la compensation d'exposition (biais EV). La valeur sera limitée à la plage autorisée. |
getWhiteBalanceModes |
Renvoie les modes de balance des blancs pris en charge par la caméra active. Les modes peuvent inclure : 'AUTO', 'LOCK', 'CONTINUOUS'. CUSTOM n'est pas répertorié tant que le support manuel n'est pas implémenté. |
getWhiteBalanceMode |
Retourne le mode de balance des blancs actuel. |
setWhiteBalanceMode |
Définit le mode de balance des blancs. CONTINUOUS maintient la balance des blancs automatique (recommandé ; évite les teintes chaudes/jaunes), LOCK fige les gains actuels, AUTO effectue un ajustement unique. CUSTOM est réservé et rejeté jusqu'à l'implémentation du support des gains manuels. |
getSupportedVideoFrameRates |
Liste les fréquences d'images vidéo supportées par la caméra active pour le format actuel. Les valeurs supportées dépendent de la caméra, de l'objectif et de la qualité vidéo sélectionnés. |
getVideoFrameRate |
Retourne la fréquence d'images vidéo configurée pour la caméra active. Sur Android, la fréquence d'images réelle lors de l'enregistrement peut varier en cas de faible luminosité ou de contrainte thermique. |
setVideoFrameRate |
Définit la fréquence d'images vidéo cible pour la session de la caméra active. Préférez passer frameRate vers startRecordVideo() lors du lancement d'un enregistrement. Rejette les valeurs non supportées avec une erreur explicite. |
Exemples
start()
Lance l'aperçu de la caméra.
import { CameraPreview } from '@capgo/camera-preview';
const result = await CameraPreview.start({ parent: 'parent' });
console.log(result);
stop()
Arrête l'aperçu de la caméra.
import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.stop();
capture()
Capture une photo avec la caméra.
import { CameraPreview } from '@capgo/camera-preview';
const result = await CameraPreview.capture({ height: 1920 });
console.log(result);
captureSample()
Capture une seule image du flux de la preview caméra.
import { CameraPreview } from '@capgo/camera-preview';
const result = await CameraPreview.captureSample({
quality: 85,
mirrorFrontCamera: false,
});
console.log(result);
startBarcodeScanner()
Lance le scan de codes-barres sur l'aperçu de la caméra active.
import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.startBarcodeScanner();
stopBarcodeScanner()
Arrête le scan de codes-barres tout en maintenant l'aperçu de la caméra.
import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.stopBarcodeScanner();
Le tableau ci-dessus liste les 56 méthodes principales. Les helpers de version et de listener, ainsi que le contrat complet de chaque méthode, sont documentés dans la dépôt GitHub.
Écouter les événements
addListener renvoie un handle. Appelez handle.remove() lors du démontage de l'écran, ou CameraPreview.removeAllListeners() pour supprimer tous les listeners.
Référence complète
Continuer avec l'utilisation de @capgo/camera-preview
Si vous utilisez Utiliser @capgo/camera-preview pour planifier le comportement des médias et de l'interface natifs, connectez-l’à @capgo/camera-preview pour les détails d'implémentation dans @capgo/camera-preview, Prise en main pour les détails d'implémentation dans Getting Started Utiliser @capgo/capacitor-live-activities pour la capacité native dans Utiliser @capgo/capacitor-live-activities @capgo/capacitor-live-activities pour les détails d'implémentation dans @capgo/capacitor-live-activities, et Utiliser @capgo/capacitor-video-player pour la fonctionnalité native dans Utilisation de @capgo/capacitor-video-player.