Guide
How to use Camera Preview in Capacitor
Tester sur appareil
Téléchargez l'application Capgo, puis scannez le code QR code.
Utilisez @capgo/camera-preview
L'interface principale du plugin CameraPreview.
Installer
bun add @capgo/camera-preview
bunx cap sync
bunx cap sync copie les fichiers natifs du plugin code dans vos projets natifs. Exécutez-l’à nouveau après chaque mise à jour du plugin.
Importer
import { CameraPreview } from '@capgo/camera-preview';
API en un coup d'œil
| Méthode | Description |
|---|---|
start |
Active la prévisualisation de la caméra. |
stop |
Désactive la prévisualisation de la caméra. |
capture |
Capturer une photo à partir de la caméra. |
captureSample |
Capturait une seule image de la flux de prévisualisation de la caméra. |
startBarcodeScanner |
Démarre la lecture de codes-barres sur la preview de la caméra active. |
stopBarcodeScanner |
Désactive la reconnaissance de code-barres tout en continuant la prévisualisation de la caméra. |
getSupportedFlashModes |
Obtient les modes de la lumière flash supportés par la caméra active. |
setAspectRatio |
Fixe le rapport d'aspect de la prévisualisation de la caméra. |
getAspectRatio |
Obtient le rapport d'aspect actuel de la prévisualisation de la caméra. |
setGridMode |
Fixe le mode de grille de l'overlay de la prévisualisation de la caméra. |
getGridMode |
Obtient le mode de grille actuel de l'overlay de prévisualisation de la caméra. |
checkPermissions |
Vérifie l'état de la permission de la caméra (et optionnellement du microphone) sans afficher le dialogue système. |
requestPermissions |
Demande les permissions de la caméra (et microphone optionnel). Si les permissions sont déjà accordées ou refusées, le statut actuel est retourné sans solliciter. showSettingsAlert Si est vrai et les autorisations sont refusées, un avertissement spécifique à la plateforme guidera l'utilisateur vers les paramètres de l'application. |
getHorizontalFov |
Obtient le champ horizontal de vision (FoV) pour la caméra active. Remarque : Cela peut être une estimation sur certains appareils. |
getSupportedPictureSizes |
Obtient les tailles de photo prises en charge par toutes les caméras. |
setFlashMode |
Fixe le mode de flash pour la caméra active. |
flip |
Alternes entre les caméras avant et arrière. |
setOpacity |
Fixe l'opacité de la prévisualisation de la caméra. |
stopRecordVideo |
Arrête une enregistrement vidéo en cours. |
startRecordVideo |
Démarre un enregistrement vidéo. |
setVideoQuality |
Fixe la qualité de l'enregistrement vidéo pour la session de la caméra active. |
getVideoQuality |
Obtient la qualité vidéo actuelle. |
getSupportedVideoQualities |
Retourne les qualités vidéo prises en charge par la caméra active. |
setVideoCodec |
Configure le codec vidéo utilisé lors de l'enregistrement. |
getVideoCodec |
Obtenez le codec vidéo actuel utilisé pour l'enregistrement. |
getSupportedVideoCodecs |
Retourne les codecs vidéo pris en charge par la caméra active. |
isVideoStabilizationSupported |
Vérifiez si la stabilisation vidéo est prise en charge par la caméra active. |
getSupportedVideoStabilizationModes |
Retourne les modes de stabilisation vidéo pris en charge par la caméra active. |
getVideoStabilizationMode |
Obtenez le mode de stabilisation vidéo actuel. |
setVideoStabilizationMode |
Configure la stabilisation vidéo pour les enregistrements. Cette option ne peut pas être modifiée pendant une enregistrement en cours. Vous pouvez également passer videoStabilizationMode en startRecordVideo() options. |
isRunning |
Vérifiez si la prévisualisation de la caméra est en cours. |
getAvailableDevices |
Obtenez tous les appareils de caméra disponibles. |
getZoom |
Gets the current zoom state, including min/max and current lens info. |
getZoomButtonValues |
Renvoie les valeurs du bouton de zoom pour un changement rapide. - iOS/Android : inclut 0,5 si la caméra ultra-large est disponible ; 1 et 2 si la caméra large est disponible ; 3 si la caméra télescopique 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 |
Change la caméra active en celle avec l'ID spécifié. deviceId. |
getDeviceId |
Récupère l'ID du périphérique de caméra actuellement lié. Sur Android, si une demande de lentille physique retombe sur une caméra logique, cela renvoie l'ID de la caméra logique liée. |
getPreviewSize |
Gets the current preview size and position. |
setPreviewSize |
Sets the preview size and position. |
setFocus |
Définit le focus de la caméra sur un point spécifique dans la prévisualisation. |
deleteFile |
Supprime un fichier à l'emplacement absolu spécifié sur le dispositif. Utilisez cela pour nettoyer rapidement les images temporaires créées avec. storeToFile. Sur web, cela n'est pas pris en charge et lancera une erreur. |
getSafeAreaInsets |
Gets the safe area insets for devices. Returns the orientation-aware notch/camera cutout inset and the current orientation. In portrait mode: returns top inset (notch at top). In landscape mode: returns left inset (notch moved to side). This specifically targets the cutout area (notch, punch hole, etc.) that all modern phones have. |
getOrientation |
Obtient l'orientation actuelle du dispositif sous format transversal. |
getExposureModes |
Renvoie les modes d'exposition pris en charge par la caméra active. Les modes peuvent inclure : 'fixe', 'auto', 'continu', 'personnalisé'. |
getExposureMode |
Renvoie le mode d'exposition actuel. |
setExposureMode |
Fixe le mode d'exposition. |
getExposureCompensationRange |
Renvoie la plage de compensation d'exposition (EV) prise en charge. |
getExposureCompensation |
Renvoie la compensation d'exposition (EV) actuelle. |
setExposureCompensation |
Fixe la compensation d'exposition (EV). La valeur sera limitée à la plage. |
getWhiteBalanceModes |
Renvoie les modes de balance blanche pris en charge par la caméra active. Les modes peuvent inclure : « AUTO », « LOCK », « CONTINU », CUSTOM Ce plugin n'est listé qu'après la mise en œuvre du support manuel. |
getWhiteBalanceMode |
Renvoie le mode de balance blanche actuel. |
setWhiteBalanceMode |
Fixe le mode de balance blanche. CONTINUOUS conserve l'équilibre blanc automatique en cours (recommandé ; évite un ton chaud/jaune), LOCK conserve les gains actuels, AUTO Effectue une ajustement une fois pour toutes. CUSTOM est réservé et rejeté jusqu'à ce que le support manuel soit mis en œuvre. |
getSupportedVideoFrameRates |
Affiche les taux de cadence vidéo pris en charge par la caméra active pour le format actuel. Les valeurs prises en charge dépendent de la caméra sélectionnée, de l'objectif et de la qualité vidéo. |
getVideoFrameRate |
Renvoie le taux de cadence vidéo configuré pour la caméra active. Sur Android, le taux de cadence réel de l'enregistrement peut encore varier en faible lumière ou sous pression thermique. |
setVideoFrameRate |
Définit le taux de cadence vidéo cible pour la session de la caméra active. Préférez passer frameRate à startRecordVideo() lors du démarrage d'une enregistrement. Rejette les valeurs non prises en charge avec un erreur claire. |
Exemples
start()
Démarrer la prévisualisation de la caméra.
import { CameraPreview } from '@capgo/camera-preview';
const result = await CameraPreview.start({ parent: 'parent' });
console.log(result);
stop()
Arrêter la prévisualisation de la caméra.
import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.stop();
capture()
Capturer une photo à partir de la caméra.
import { CameraPreview } from '@capgo/camera-preview';
const result = await CameraPreview.capture({ height: 1920 });
console.log(result);
captureSample()
Capturera une seule image de la flux de prévisualisation de la caméra.
import { CameraPreview } from '@capgo/camera-preview';
const result = await CameraPreview.captureSample({
quality: 85,
mirrorFrontCamera: false,
});
console.log(result);
startBarcodeScanner()
Démarre la lecture de codes-barres sur la preview de la caméra active.
import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.startBarcodeScanner();
stopBarcodeScanner()
Arrête le balayage de code-barre tout en continuant à afficher la prévisualisation de la caméra.
import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.stopBarcodeScanner();
La table ci-dessus liste les 56 méthodes de base. Les aides aux écouteurs et aux versions, ainsi que le contrat complet de chaque méthode, sont documentés dans le répertoire GitHub.
Écoutez les événements
addListener retourne un gestionnaire. Appelle handle.remove() lorsque l'écran est démonté, ou CameraPreview.removeAllListeners() pour supprimer tous les écouteurs.
Référence complète
Continuez à partir de l'utilisation de @capgo/camera-preview
Si vous utilisez L'utilisation de @capgo/camera-preview pour planifier le comportement des médias et de l'interface native, connectez-l’à @capgo/camera-preview pour les détails d'implémentation dans @capgo/camera-preview, Getting Started pour les détails d'implémentation dans Getting Started, L'utilisation de @capgo/capacitor-live-activities pour la capacité native dans L'utilisation de @capgo/capacitor-live-activities, @capgo/capacitor-activités en direct pour les détails d'implémentation dans @capgo/capacitor-live-activities, et Utilisez @capgo/capacitor-video-player pour la capacité native dans Utilisez @capgo/capacitor-video-player.