Hauptinhalt überspringen
@capgo/capacitor-datei-picker Dateien & Speicher Offene Quelle

Datei Picker Capacitor-Plugin

Dateien, Bilder, Videos und Verzeichnisse mit vollständiger nativer Unterstützung für iOS und Android einschließlich HEIC-Umstellung

Installieren

bun add @capgo/capacitor-file-picker bunx cap sync
npm, pnpm oder yarn
  • npm install @capgo/capacitor-file-picker
  • pnpm add @capgo/capacitor-file-picker
  • yarn add @capgo/capacitor-file-picker

Anleitung

Wie man den Datei- Picker in Capacitor verwendet

Mit @capgo/capacitor-datei- picker

Capacitor-Datei- Picker-Plugin-Interface für die Auswahl von Dateien, Bildern, Videos und Verzeichnissen.

Installieren

bun add @capgo/capacitor-file-picker
bunx cap sync

bunx cap sync kopiert das Plugin- native code in deine native Projekte. Führe es erneut aus, nachdem du jedes Plugin aktualisiert hast.

Importieren

import { CapgoFilePicker } from '@capgo/capacitor-file-picker';

API im Überblick

Methode Beschreibung
pickFiles Wählen Sie ein oder mehrere Dateien vom Gerät.
pickImages Wählen Sie ein oder mehrere Bilder aus der Galerie. Nur Android/iOS.
pickVideos Wählen Sie ein oder mehrere Videos aus der Galerie. Nur Android/iOS.
pickMedia Wählen Sie ein oder mehrere Bilder oder Videos aus der Galerie. Nur Android/iOS.
pickDirectory Wählen Sie einen Ordner vom Gerät. Nur Android/iOS.
convertHeicToJpeg Konvertieren Sie ein HEIC-Bild in JPEG-Format. Nur iOS.
copyFile Kopieren Sie eine Datei in eine neue Position.
checkPermissions Überprüfe den Zustand der breiten Speicher- oder Medienberechtigung. Picker-only-Flüsse sollten nicht blockieren. pickFiles(), pickImages(), pickVideos()Wählen Sie pickMedia() auf dieser Berechtigung ab Android 13+. Nur für Android.
requestPermissions Bereiten Sie die breite Speicherung oder Medienberechtigung vor. Verlangen oder deklarieren Sie nicht. READ_MEDIA_IMAGES or READ_MEDIA_VIDEO Nur zur Verwendung von Picker-APIs. Google Play erlaubt diese Berechtigungen nur, wenn Picker-Alternativen für die Kernfunktionalität der App nicht ausreichen. Verwenden Sie @capgo/capacitor-file-picker Methode des Pickers anstelle für vom Benutzer ausgewählte Datei, Bild oder Video-Zugriff. Nur für Android.

Examples

pickFiles()

Wählen Sie ein 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ählen Sie eine oder mehrere Bilder aus der Galerie. Nur für 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ählen Sie einen Ordner vom Gerät. Nur für 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ählen Sie eine oder mehrere Bilder oder Videos aus der Galerie. Nur für 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 einen Ordner 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()

Ein HEIC-Bild in JPEG-Format umwandeln. Nur für 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 Tabelle oben listet die 9 Kernmethoden. Helfer für Listener und Versionen sowie die vollständige Vertragsvereinbarung jeder Methode sind in der GitHub-Repository.

Zu Ereignissen lauschen

addListener gibt einen Handle zurück. Ruf handle.remove() wenn die Bildschirmabrechnung erfolgt ist, oder CapgoFilePicker.removeAllListeners() um jeden Listener zu löschen.

Vollständige Referenz

Weitermachen von Using @capgo/capacitor-file-picker

If Sie @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__ verwenden Verwenden Sie @capgo/capacitor-file-picker um Speicherplatz und Dateimanagement zu planen, verbinden Sie es mit @capgo/capacitor-file-picker um die Implementierungsdetails in @capgo/capacitor-file-picker zu erhalten Zum Starten um die Implementierungsdetails in Zum Starten zu erhalten @capgo/capacitor-Daten-Speicher-SQLite um die Implementierungsdetails in @capgo/capacitor-data-storage-sqlite zu erhalten Verwenden Sie @capgo/capacitor-data-storage-sqlite um die native Fähigkeit in Verwenden Sie @capgo/capacitor-data-storage-sqlite, und @capgo/capacitor-Datei zur Implementierungsdetail in @capgo/capacitor-datei.

FAQ

FAQ zur File Picker-Plugin

Wie installiere ich das File Picker-Plugin in einer Capacitor-Anwendung?

Führen Sie "bun add @capgo/capacitor-file-picker" (oder "npm install @capgo/capacitor-file-picker"), dann führen Sie "bunx cap sync" aus, damit die iOS- und Android-Projekte die native code-Datei aufnehmen. Importieren Sie es aus "@capgo/capacitor-file-picker" in Ihrer code-Anwendung.

Funktioniert @capgo/capacitor-file-picker mit React, Vue und Angular?

Ja. File Picker ist ein Capacitor-Paket, daher funktioniert es mit jedem Webframework, das innerhalb von Capacitor läuft, einschließlich Ionic, React, Vue, Angular, Svelte und plain JavaScript.

Welche Capacitor-Version unterstützt @capgo/capacitor-file-picker?

Capgo-Plugins folgen der Capacitor-Version: verwenden Sie die Plugin-Major-Version, die Ihrer Capacitor-Major-Version entspricht (z.B. Plugin v8 mit Capacitor 8). Die Kompatibilitäts-Tabelle im GitHub-README listet die unterstützten Versionen auf.

Ist @capgo/capacitor-file-picker kostenlos und Open-Source?

Ja. Die Quellcode-code ist öffentlich auf GitHub unter https://github.com/Cap-go/capacitor-file-picker/ verfügbar und das Paket kann kostenlos installiert werden von npm. Bug-Reports und Pull-Requests sind willkommen.

Kann ich code aktualisieren, das File Picker verwendet, ohne eine App-Store-Überprüfung?

Die Installation oder das Upgrade des Plugins ändert die native code, daher benötigt es eine neue Store-Build. Danach können JavaScript-, HTML- und CSS-Änderungen, die den Plugin-Aufruf enthalten, sofort mit Capgo-Live-Updates verschickt werden.

Dateien ohne Wartezeit auf die App-Überprüfung bereitstellen

Einmal die Capgo-Erweiterung in Ihrem Store-Builder installiert, drücken Capgo-Live-Updates Ihre JavaScript-, HTML- und CSS-Änderungen an die Benutzer in Minuten aus.

Mit Capgo beginnen