Anleitung
File Picker in Capacitor nutzen
Mit @capgo/capacitor-file-picker arbeiten
Capacitor File Picker Plugin-Schnittstelle zum Auswählen von Dateien, Bildern, Videos und Verzeichnissen.
Installieren
bun add @capgo/capacitor-file-picker
bunx cap sync
bunx cap sync kopiert den nativen code des Plugins in deine nativen Projekte. Nach jedem Plugin-Upgrade erneut ausführen.
Importieren
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
API auf einen Blick
| Methode | Beschreibung |
|---|---|
pickFiles |
Wähle eine oder mehrere Dateien vom Gerät aus. |
pickImages |
Wähle ein oder mehrere Bilder aus der Galerie. Nur Android/iOS. |
pickVideos |
Wähle ein oder mehrere Videos aus der Galerie. Nur Android/iOS. |
pickMedia |
Wähle ein oder mehrere Bilder oder Videos aus der Galerie. Nur Android/iOS. |
pickDirectory |
Wähle ein Verzeichnis vom Gerät aus. Nur Android/iOS. |
convertHeicToJpeg |
Konvertiere ein HEIC-Bild ins JPEG-Format. Nur iOS. |
copyFile |
Eine Datei an einen neuen Speicherort kopieren. |
checkPermissions |
Prüfe den Status der weitreichenden Speicher- oder Medienberechtigung. Picker-only-Flows sollten nicht pickFiles(), pickImages(), pickVideos(), oder pickMedia() auf diese Berechtigung angewiesen sein (Android 13+). Nur Android. |
requestPermissions |
Fordere weitreichende Speicher- oder Medienberechtigungen an. Fordere oder deklariere sie nicht, READ_MEDIA_IMAGES oder READ_MEDIA_VIDEO nur um Picker-APIs zu nutzen. Google Play erlaubt diese Berechtigungen nur, wenn Picker-Alternativen für die Kernfunktionen der App nicht ausreichen. Nutze @capgo/capacitor-file-picker stattdessen Picker-Methoden für den Zugriff auf vom Nutzer ausgewählte Dateien, Bilder oder Videos. Nur Android. |
Beispiele
pickFiles()
Wähle eine oder mehrere Dateien vom Gerät aus.
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()
Wähle ein oder mehrere Bilder aus der Galerie. Nur 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()
Wähle ein oder mehrere Videos aus der Galerie. Nur 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()
Wähle ein oder mehrere Bilder oder Videos aus der Galerie. Nur 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()
Wähle ein Verzeichnis vom Gerät aus. Nur Android/iOS.
import { CapgoFilePicker } from '@capgo/capacitor-file-picker';
const result = await CapgoFilePicker.pickDirectory();
console.log('Selected directory:', result.path);
convertHeicToJpeg()
Konvertiere ein HEIC-Bild ins JPEG-Format. Nur 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);
Die obige Tabelle listet die 9 Kernmethoden auf. Listener- und Versions-Helper sowie der vollständige Contract jeder Methode sind in der GitHub Repository.
Events abonnieren
addListener gibt ein Handle zurück. Rufe handle.remove() auf, wenn der Screen unmountet, oder CapgoFilePicker.removeAllListeners() auf, um alle Listener zu entfernen.
Vollständige Referenz
Weiter geht's mit @capgo/capacitor-file-picker
Wenn du es nutzt Mit @capgo/capacitor-file-picker arbeiten um Speicher- und Dateiverwaltung zu planen, verbinde es mit @capgo/capacitor-file-picker für die Implementierungsdetails in @capgo/capacitor-file-picker, Erste Schritte für die Implementierungsdetails in Erste Schritte, @capgo/capacitor-data-storage-sqlite für die Implementierungsdetails in @capgo/capacitor-data-storage-sqlite, Mit @capgo/capacitor-data-storage-sqlite für die native Funktion bei der Nutzung von @capgo/capacitor-data-storage-sqlite und @capgo/capacitor-file für die Implementierungsdetails in @capgo/capacitor-file.