コンテンツにスキップ

はじめに

ターミナルウィンドウ
bun add @capgo/camera-preview
bunx cap sync
import { CameraPreview } from '@capgo/camera-preview';

カメラのプレビューを開始します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.start({} as CameraPreviewOptions);

カメラのプレビューを停止します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.stop();

カメラから写真を撮ります。

もし storeToFiletrue プレビューを開始したときに value は、絶対ファイルパスがデバイス上にあります。getBase64FromFilePathを使用して、ファイルパスからbase64文字列を取得します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.capture({} as CameraPreviewPictureOptions);

カメラプレビュー ストリームから1枚のフレームを撮ります。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.captureSample({} as CameraSampleOptions);

現在のカメラでサポートされているフラッシュモードを取得します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getSupportedFlashModes();

カメラプレビューのアスペクト比を設定します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.setAspectRatio({} as { aspectRatio: '4:3' | '16:9'; x?: number; y?: number });

カメラプレビューの現在のアスペクト比を取得します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getAspectRatio();

カメラプレビュー上のオーバーレイのグリッドモードを設定します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.setGridMode({} as { gridMode: GridMode });

カメラプレビュー上のオーバーレイの現在のグリッドモードを取得します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getGridMode();

現在のカメラ(オプションでマイク)許可状態を確認しますが、システムダイアログを表示しません。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.checkPermissions();

カメラ(オプションでマイク)許可を要求します。許可が既に付与されたり拒否された場合は、現在の状態が返されますがダイアログを表示しません。"is true"の場合、許可が拒否されている場合、プラットフォーム固有のアラートが表示されます。ユーザーにアプリ設定への誘導を行います。 showSettingsAlert コピー

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.requestPermissions();

コピー

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getHorizontalFov();

Copy to clipboard

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getSupportedPictureSizes();

アクティブなカメラのフラッシュモードを設定します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.setFlashMode({} as { flashMode: CameraPreviewFlashMode | string });

前面と後面カメラを切り替えます。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.flip();

カメラプレビューの不透明度を設定します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.setOpacity({} as CameraOpacityOptions);

進行中のビデオレコーディングを停止します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.stopRecordVideo();

動画の録画を開始します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.startRecordVideo({} as CameraPreviewOptions);

カメラのプレビューが現在実行中かどうかを確認します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.isRunning();

利用可能なカメラデバイスをすべて取得します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getAvailableDevices();

現在のズームの状態、最小値/最大値、およびレンズ情報を取得します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getZoom();

スイッチングのためのズームボタンの値を返します。

  • iOS/Android: 超広角が利用可能の場合、0.5を含み、広角が利用可能の場合、1と2を含み、望遠レンズが利用可能の場合、3を含みます。
  • ウェブ: サポートされていません。
import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getZoomButtonValues();

カメラのズームレベルを設定します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.setZoom({} as { level: number; ramp?: boolean; autoFocus?: boolean });

現在のフラッシュモードを取得します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getFlashMode();

Switches the active camera to the one with the specified deviceId.

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.setDeviceId({} as { deviceId: string });

現在バインドされているカメラデバイスのIDを取得します。 Androidの場合、物理レンズの要求が論理カメラにフォールバックした場合、このIDは論理カメラのIDを返します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getDeviceId();

現在のプレビューのサイズと位置を取得します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getPreviewSize();

プレビューのサイズと位置を設定します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.setPreviewSize({} as { x?: number; y?: number; width: number; height: number });

カメラの焦点をプレビューの特定のポイントに設定します。

注記: プラグインは、ネイティブのタップフォーカスジェスチャーハンドラーを追加しません。タップをHTML/JS (例:オーバーレイUI) で処理し、ここに正規化された座標を渡してください。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.setFocus({} as { x: number; y: number });

ファイルを指定された絶対パスに存在するデバイス上で削除します。\n これは、Capacitorで作成した一時的な画像を簡単にクリーンアップするために使用します。 storeToFile.\nウェブ上ではサポートされていません。エラーが発生します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.deleteFile({} as { path: string });

デバイスの安全なエリアのインセットを取得します。 オrientationに応じたノッチ/カメラカットアウトのインセットと現在のオrientationを返します。 ポートレートモードの場合、上部のインセット(上部のノッチ)を返します。 ランドスケープモードの場合、左側のインセット(ノッチが側面に移動)を返します。 このAPIは、すべてのモダン電話が持つカットアウトエリア(ノッチ、パンチホールなど)を特定的にターゲットしています。

Android: \u738b\u306b\u8a66\u4e2d\u3060\u306f\u5f53\u524d\u5b50\u5f62\u3060\u3044\u306e\u5c0f\u5e38\u3067\u53f0\u8a66\u3092\u53d1\u3002 iOS: \u30a8\u30a7\u30b5\u30f3\u306b\u53f0\u8a66\u3092\u53d1\u3001\u30d1\u30c8\u30b9\u30bf\u30fc\u30b5\u30a4\u30f3\u30c8\u306b\u53f0\u8a66\u3092\u53d1\u3001\u30d1\u30c8\u30b9\u30bf\u30fc\u30b5\u30a4\u30f3\u30c8\u306b\u53f0\u8a66\u3092\u53d1\u3001\u30d1\u30c8\u30b9\u30bf\u30fc\u30b5\u30a4\u30f3\u30c8\u306b\u53f0\u8a66\u3092\u53d1\u3001\u30d1\u30c8\u30b9\u30bf\u30fc\u30b5\u30a4\u30f3\u30c8\u306b\u53f0\u8a66\u3092\u53d1\u3001\u30d1\u30c8\u30b9\u30bf\u30fc\u30b5\u30a4\u30f3\u30c8\u306b\u53f0\u8a66\u3092\u53d1\u3001\u30d1\u30c8\u30b9\u30bf\u30fc\u30b5\u30a4\u30f3\u30c8\u306b\u53f0\u8a66\u3092\u53d1\u3001\u30d1\u30c8\u30b9\u30bf\u30fc\u30b5\u30a4\u30f3\u30c8\u306b\u53f0\u8a66\u3092\u53d1\u3001\u30d1\u30c8\u30b9\u30bf\u30fc\u30b5\u30a4\u30f3\u30c8\u306b\u53f0\u8a66\u309

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getSafeAreaInsets();

デバイスの現在の向きをクロスプラットフォーム形式で取得します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getOrientation();

アクティブなカメラがサポートする露光モードを返します。 モードには、‘locked’、‘auto’、‘continuous’、‘custom’が含まれます。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getExposureModes();

現在の露光モードを返します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getExposureMode();

露光モードを設定します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.setExposureMode({} as { mode: ExposureMode });

露出補償範囲を返します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getExposureCompensationRange();

現在の露出補償を返します。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.getExposureCompensation();

露出補償を設定します。値は範囲に丸められます。

import { CameraPreview } from '@capgo/camera-preview';
await CameraPreview.setExposureCompensation({} as { value: number });

CameraPreviewOptions

型の参照

カメラプレビューの設定オプションを定義します。

export interface CameraPreviewOptions {
/**
* The parent element to attach the video preview to.
* @platform web
*/
parent?: string;
/**
* A CSS class name to add to the preview element.
* @platform web
*/
className?: string;
/**
* The width of the preview in pixels. Defaults to the screen width.
* @platform android, ios, web
*/
width?: number;
/**
* The height of the preview in pixels. Defaults to the screen height.
* @platform android, ios, web
*/
height?: number;
/**
* The horizontal origin of the preview, in pixels.
* @platform android, ios
*/
x?: number;
/**
* The vertical origin of the preview, in pixels.
* @platform android, ios
*/
y?: number;
/**
* The aspect ratio of the camera preview, '4:3' or '16:9' or 'fill'.
* Cannot be set if width or height is provided, otherwise the call will be rejected.
* Use setPreviewSize to adjust size after starting.
*
* @since 2.0.0
*/
aspectRatio?: '4:3' | '16:9';
/**
* Controls how the camera preview fills the available space.
* - 'contain': Fits the entire preview within the space, may show letterboxing (default).
* - 'cover': Fills the entire space, may crop edges of the preview.
* @default "contain"
* @platform android, ios, web
*/
aspectMode?: 'cover' | 'contain';
/**
* The grid overlay to display on the camera preview.
* @default "none"
* @since 2.1.0
*/
gridMode?: GridMode;
/**
* Adjusts the y-position to account for safe areas (e.g., notches).
* @platform ios
* @default false
*/
includeSafeAreaInsets?: boolean;
/**
* If true, places the preview behind the webview.
* @platform android
* @default true
*/
toBack?: boolean;
/**
* Bottom padding for the preview, in pixels.
* @platform android, ios
*/
paddingBottom?: number;
/**
* Whether to rotate the preview when the device orientation changes.
* @platform ios
* @default true
*/
rotateWhenOrientationChanged?: boolean;
/**
* The camera to use.
* @default "rear"
*/
position?: CameraPosition | string;
/**
* If true, saves the captured image to a file and returns the file path.
* If false, returns a base64 encoded string.
* @default false
*/
storeToFile?: boolean;
/**
* If true, prevents the plugin from rotating the image based on EXIF data.
* @platform android
* @default false
*/
disableExifHeaderStripping?: boolean;
/**
* If true, disables the audio stream, preventing audio permission requests.
* @default true
*/
disableAudio?: boolean;
/**
* If true, locks the device orientation while the camera is active.
* @platform android
* @default false
*/
lockAndroidOrientation?: boolean;
/**
* If true, allows the camera preview's opacity to be changed.
* @platform android, web
* @default false
*/
enableOpacity?: boolean;
/**
* If true, disables the visual focus indicator when tapping to focus.
* @platform android, ios
* @default false
*/
disableFocusIndicator?: boolean;
/**
* The `deviceId` of the camera to use. If provided, `position` is ignored.
* @platform ios
*/
deviceId?: string;
/**
* On Android, attempts to bind a physical camera directly when `deviceId` refers to a physical lens.
* Disabled by default because OEM support is inconsistent; when false, Android keeps the current logical-camera fallback behavior.
* @default false
* @platform android
*/
enablePhysicalDeviceSelection?: boolean;
/**
* The initial zoom level when starting the camera preview.
* If the requested zoom level is not available, the native plugin will reject.
* @default 1.0
* @platform android, ios
* @since 2.2.0
*/
initialZoomLevel?: number;
/**
* The vertical positioning of the camera preview.
* @default "center"
* @platform android, ios, web
* @since 2.3.0
*/
positioning?: CameraPositioning;
/**
* If true, enables video capture capabilities when the camera starts.
* @default false
* @platform android
* @since 7.11.0
*/
enableVideoMode?: boolean;
/**
* If true, forces the camera to start/restart even if it's already running or busy.
* This will kill the current camera session and start a new one, ignoring all state checks.
* @default false
* @platform android, ios, web
*/
force?: boolean;
/**
* Sets the quality of video for recording.
* Options: 'low', 'medium', 'high'
* @note On Android requires 'enableVideoMode' to be true
* @note Will affect the entire preview stream for iOS
* @platform ios, android
* @default "high"
*/
videoQuality?: 'low' | 'medium' | 'high';
}

写真を撮るためのオプションを定義します。

export interface CameraPreviewPictureOptions {
/**
* The maximum height of the picture in pixels. The image will be resized to fit within this height while maintaining aspect ratio.
* If not specified the captured image will match the preview's visible area.
*/
height?: number;
/**
* The maximum width of the picture in pixels. The image will be resized to fit within this width while maintaining aspect ratio.
* If not specified the captured image will match the preview's visible area.
*/
width?: number;
/**
* The quality of the captured image, from 0 to 100.
* Does not apply to `.png` format.
* @default 85
*/
quality?: number;
/**
* The format of the captured image.
* @default "jpeg"
*/
format?: PictureFormat;
/**
* If true, the captured image will be saved to the user's gallery.
* @default false
* @since 7.5.0
*/
saveToGallery?: boolean;
/**
* If true, the plugin will attempt to add GPS location data to the image's EXIF metadata.
* This may prompt the user for location permissions.
* @default false
* @since 7.6.0
*/
withExifLocation?: boolean;
/**
* If true, the plugin will embed a timestamp in the top-right corner of the image.
* @default false
* @since 7.17.0
*/
embedTimestamp?: boolean;
/**
* If true, the plugin will embed the current location in the top-right corner of the image.
* Requires `withExifLocation` to be enabled.
* @default false
* @since 7.18.0
*/
embedLocation?: boolean;
/**
* Sets the priority for photo quality vs. capture speed.
* - "speed": Prioritizes faster capture times, may reduce image quality.
* - "balanced": Aims for a balance between quality and speed.
* - "quality": Prioritizes image quality, may reduce capture speed.
* See https://developer.apple.com/documentation/avfoundation/avcapturephotosettings/photoqualityprioritization for details.
*
* @since 7.21.0
* @platform ios
* @default "speed"
*/
photoQualityPrioritization?: 'speed' | 'balanced' | 'quality';
}

画像から抽出されたEXIFデータを表します。

export interface ExifData {
[key: string]: any;
}

カメラプレビューからサンプルフレームを撮るためのオプションを定義します。

export interface CameraSampleOptions {
/**
* The quality of the captured sample, from 0 to 100.
* @default 85
*/
quality?: number;
}

カメラで利用可能なフラッシュモード。

export type CameraPreviewFlashMode = 'off' | 'on' | 'auto' | 'torch';
export type GridMode = 'none' | '3x3' | '4x4';

PermissionRequestOptions

許可要求オプション
export interface PermissionRequestOptions {
disableAudio?: boolean;
showSettingsAlert?: boolean;
title?: string;
message?: string;
openSettingsButtonTitle?: string;
cancelButtonTitle?: string;
}

CameraPermissionStatus

カメラ許可状態
export interface CameraPermissionStatus {
camera: PermissionState;
microphone?: PermissionState;
}

特定の方向に向いたカメラでサポートされる写真サイズを表します。

export interface SupportedPictureSizes {
/** The camera direction ("front" or "rear"). */
facing: string;
/** A list of supported picture sizes for this camera. */
supportedPictureSizes: PictureSize[];
}

カメラプレビューの不透明度の設定のオプションを定義します。

export interface CameraOpacityOptions {
/**
* The opacity percentage, from 0.0 (fully transparent) to 1.0 (fully opaque).
* @default 1.0
*/
opacity?: number;
}

デバイス上の物理的なカメラを表します (例: フロントカメラ)。

export interface CameraDevice {
/** A unique identifier for the camera device. */
deviceId: string;
/** A human-readable name for the camera device. */
label: string;
/** The physical position of the camera on the device. */
position: CameraPosition;
/** A list of all available lenses for this camera device. */
lenses: CameraLens[];
/** The overall minimum zoom factor available across all lenses on this device. */
minZoom: number;
/** The overall maximum zoom factor available across all lenses on this device. */
maxZoom: number;
/** Identifies whether the device is a logical camera (composed of multiple physical lenses). */
isLogical: boolean;
}

現在アクティブなレンズの詳細情報を表します。

export interface LensInfo {
/** The focal length of the active lens in millimeters. */
focalLength: number;
/** The device type of the active lens. */
deviceType: DeviceType;
/** The base zoom ratio of the active lens (e.g., 0.5x, 1.0x). */
baseZoomRatio: number;
/** The current digital zoom factor applied on top of the base zoom. */
digitalZoom: number;
}

このページはプラグインの src/definitions.ts API のパブリック変更を再度同步するときに実行してください。