ガイド
Capacitor で File Picker を使う方法
@capgo/capacitor-file-picker の使い方
Capacitor File Picker プラグインは、ファイル、画像、動画、ディレクトリを選択するためのインターフェースです。
インストール
bun add @capgo/capacitor-file-picker
bunx cap sync
bunx cap sync プラグインのネイティブcodeをネイティブプロジェクトにコピーします。プラグインをアップグレードするたびに再度実行してください。
インポート
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
API の概要
| メソッド | 説明 |
|---|---|
pickFiles |
デバイスから1つ以上のファイルを選択します。 |
pickImages |
ギャラリーから1つ以上の画像を選択します。Android/iOS のみ対応。 |
pickVideos |
ギャラリーから1つ以上の動画を選択します。Android/iOS のみ対応。 |
pickMedia |
ギャラリーから1つ以上の画像または動画を選択します。Android/iOS のみ対応。 |
pickDirectory |
デバイスからディレクトリを選択します。Android/iOSのみ対応。 |
convertHeicToJpeg |
HEIC画像をJPEG形式に変換します。iOSのみ対応。 |
copyFile |
ファイルを新しい場所にコピーします。 |
checkPermissions |
広範なストレージまたはメディア権限の状態を確認します。ピッカー専用のフローでは、 pickFiles(), pickImages(), pickVideos()、または pickMedia() この権限でゲートすべきではありません。Android 13以降。Androidのみ。 |
requestPermissions |
広範なストレージまたはメディア権限を要求します。ピッカーAPIの使用 READ_MEDIA_IMAGES または READ_MEDIA_VIDEO のためにのみ要求・宣言しないでください。Google Playでは、ピッカーの代替手段がアプリのコア機能に不十分な場合のみ、これらの権限を許可します。 @capgo/capacitor-file-picker ユーザーが選択したファイル、画像、またはビデオへのアクセスには、代わりにピッカーメソッドを使用してください。Androidのみ。 |
例
pickFiles()
デバイスから1つ以上のファイルを選択します。
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickFiles({
types: ['application/pdf', 'image/*'],
limit: 5,
readData: false
});
console.log('Picked files:', result.files);
pickImages()
ギャラリーから1つ以上の画像を選択します。Android/iOSのみ。
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickImages({
limit: 10,
readData: false
});
console.log('Picked images:', result.files);
pickVideos()
ギャラリーから1つ以上のビデオを選択します。Android/iOSのみ。
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickVideos({
limit: 3,
skipTranscoding: true
});
console.log('Picked videos:', result.files);
pickMedia()
ギャラリーから1つ以上の画像またはビデオを選択します。Android/iOSのみ。
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickMedia({
limit: 5,
readData: true
});
console.log('Picked media:', result.files);
pickDirectory()
デバイスからディレクトリを選択します。Android/iOSのみ対応。
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickDirectory();
console.log('Selected directory:', result.path);
convertHeicToJpeg()
HEIC画像をJPEG形式に変換します。iOSのみ対応。
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.convertHeicToJpeg({
path: '/path/to/image.heic',
quality: 0.9
});
console.log('Converted file:', result.path);
上記の表は9つのコアメソッドの一覧です。リスナーとバージョンのヘルパー、および各メソッドの完全な仕様は、次のドキュメントで説明しています: GitHub リポジトリ.
イベントをリッスンする
addListener ハンドルを返します。画面がアンマウントされるときに handle.remove() 画面がアンマウントされるとき、または CapgoFilePicker.removeAllListeners() すべてのリスナーを解除します。
完全なリファレンス
@capgo/capacitor-file-picker の使い方から続ける
使用している場合 @capgo/capacitor-file-picker の使い方 ストレージとファイル処理を計画するには、以下と連携してください： @capgo/capacitor-file-picker 実装の詳細については、@capgo/capacitor-file-picker を参照してください。 スタートガイド スタートガイドの実装詳細については、 @capgo/capacitor-data-storage-sqlite @capgo/capacitor-data-storage-sqlite の実装の詳細については、 @capgo/capacitor-data-storage-sqlite の使い方 @capgo/capacitor-data-storage-sqlite を使う際のネイティブ機能については、また @capgo/capacitor-file @capgo/capacitor-file. の実装詳細については