Passer à la navigation principale
@capgo/capacitor-pick de fichier Dossiers et stockage Source

Pick de fichier plugin Capacitor

Sélectionnez des fichiers, des images, des vidéos et des dossiers avec un support natif complet pour iOS et Android, y compris la conversion HEIC

Installer

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

Guide

How to use File Picker in Capacitor

Utilisation de @capgo/capacitor-file-picker

Capacitor Interface de plugin de sélection de fichiers, d'images, de vidéos et de dossiers.

Installer

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

bunx cap sync copie le code natif du plugin dans vos projets natifs. Exécutez-l’à nouveau après chaque mise à jour du plugin.

Importer

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

API en un coup d'œil

Méthode Description
pickFiles Sélectionnez un ou plusieurs fichiers sur le dispositif.
pickImages Pick one or more images from the gallery. Android/iOS only.
pickVideos Sélectionnez une ou plusieurs vidéos de la galerie. (Android/iOS uniquement.)
pickMedia Sélectionnez un ou plusieurs images ou vidéos de la galerie. Disponible uniquement sur Android/iOS.
pickDirectory Pick a directory from the device. Android/iOS only.
convertHeicToJpeg Convertissez une image HEIC en JPEG. Disponible uniquement sur iOS.
copyFile Copiez un fichier vers un nouveau emplacement.
checkPermissions Vérifiez l'état des autorisations de stockage ou de médias. Les flux Picker ne doivent pas bloquer l'accès. pickFiles(), pickImages(), pickVideos(), ou pickMedia() sur cette autorisation sur Android 13+. Android uniquement.
requestPermissions Demandez des autorisations de stockage ou de médias. N'obtenez pas ou déclarez READ_MEDIA_IMAGES ou READ_MEDIA_VIDEO Utilisez uniquement les API de sélection. Google Play autorise ces permissions uniquement lorsque les alternatives de sélection ne sont pas suffisantes pour la fonctionnalité de base de l'application. Utilisez @capgo/capacitor-file-picker ou déclarez des autorisations de stockage ou de médias. N'obtenez pas ou déclarez

Examples

pickFiles()

Sélectionnez un ou plusieurs fichiers sur le dispositif.

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()

ou déclarez des autorisations de stockage ou de médias. N'obtenez pas ou déclarez

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

const result = await CapgoFilePicker.pickImages({
  limit: 10,
  readData: false
});
console.log('Picked images:', result.files);

pickVideos()

Sélectionnez une ou plusieurs vidéos de la galerie. (Seulement 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()

Sélectionnez une ou plusieurs images ou vidéos de la galerie. Disponible uniquement sur 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()

Choisissez un répertoire du appareil. Disponible uniquement sur Android/iOS.

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

const result = await CapgoFilePicker.pickDirectory();
console.log('Selected directory:', result.path);

convertHeicToJpeg()

Convertir une image HEIC en JPEG. Disponible uniquement sur 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);

La table ci-dessus liste les 9 méthodes de base. Les listeners et les aides de version, 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. Appelez handle.remove() lorsque l'écran est démonté, ou CapgoFilePicker.removeAllListeners() pour supprimer tous les listeners.

Référence complète

Continuez à partir de l'utilisation de @capgo/capacitor-file-picker

Si vous utilisez L'utilisation de @capgo/capacitor-file-picker pour planifier le stockage et la gestion des fichiers, connectez-l’avec @capgo/capacitor-picker-de-fichier pour les détails d'implémentation dans @capgo/capacitor-file-picker Getting Started pour les détails d'implémentation dans Démarrage @capgo/capacitor-stockage-de-données-sqlite pour les détails d'implémentation dans @capgo/capacitor-data-storage-sqlite L'utilisation de @capgo/capacitor-data-storage-sqlite pour la capacité native dans l'utilisation de @capgo/capacitor-data-storage-sqlite, et @capgo/capacitor-fichier pour les détails d'implémentation dans @capgo/capacitor-fichier.

FAQ

FAQ du plugin File Picker

Comment installer le plugin File Picker dans une application Capacitor?

Exécutez « bun add @capgo/capacitor-file-picker » (ou « npm install @capgo/capacitor-file-picker »), puis exécutez « bunx cap sync » afin que les projets iOS et Android prennent en compte le code natif. Importez-l’à partir de « @capgo/capacitor-file-picker » dans votre application code.

Le plugin @capgo/capacitor-file-picker fonctionne-t-il avec React, Vue et Angular?

Oui. Le package File Picker est un Capacitor package, il fonctionne donc avec tout framework web qui s'exécute dans un Capacitor, y compris Ionic, React, Vue, Angular, Svelte et JavaScript simple.

Quelle version de Capacitor est prise en charge par @capgo/capacitor-file-picker?

Les plugins Capgo suivent la version majeure de Capacitor : utilisez la version majeure du plugin qui correspond à la version majeure de votre Capacitor (par exemple, plugin v8 avec Capacitor 8). La table de compatibilité dans le README du GitHub liste les versions maintenues.

Le plugin @capgo/capacitor-file-picker est-il gratuit et open source?

Oui. Le code source code est public sur GitHub à l'adresse https://github.com/Cap-go/capacitor-file-picker/ et le package est gratuit pour l'installer depuis npm. Les rapports de bogues et les demandes de modification sont les bienvenus.

Peut-on mettre à jour code qui utilise File Picker sans passer par une revue de l'App Store?

L'installation ou la mise à jour du plugin change le code natif, il faut donc une nouvelle build de l'application. Une fois cela fait, les modifications JavaScript, HTML et CSS qui appellent le plugin peuvent être déployées instantanément avec les mises à jour Capgo.

Ship File Picker changes without waiting for app review

Une fois le plugin est dans votre magasin de build, Capgo mises à jour en direct poussent vos modifications de JavaScript, HTML et CSS vers les utilisateurs en quelques minutes.

Démarrer avec Capgo