Pasar al contenido principal
@capgo/capacitor-selector-de-archivo Archivos y almacenamiento Fuente abierta

Selector de archivo plugin de Capacitor

Selecciona archivos, imágenes, videos y directorios con soporte nativo completo para iOS y Android, incluyendo conversión de HEIC

Instalar

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

Guía

Cómo usar el selector de archivos en Capacitor

Usando @capgo/capacitor-selector-de-archivos

Interfaz del plugin de selector de archivos, imágenes, videos y directorios de Capacitor.

Instalar

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

bunx cap sync copia el code nativo del plugin en tus proyectos nativos. Ejecútalo de nuevo después de cada actualización del plugin.

Importar

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

Vista previa de API

Método Descripción
pickFiles Selecciona uno o varios archivos del dispositivo.
pickImages Selecciona uno o varios imágenes de la galería. Solo para Android/iOS.
pickVideos Selecciona uno o varios videos de la galería. Solo para Android/iOS.
pickMedia Selecciona uno o varios imágenes o videos de la galería. Solo para Android/iOS.
pickDirectory Selecciona un directorio del dispositivo. Solo para Android/iOS.
convertHeicToJpeg Convierte una imagen HEIC a formato JPEG. Solo para iOS.
copyFile Copia un archivo a una ubicación nueva.
checkPermissions Verifique el estado de permiso de almacenamiento o medios amplios. No debe bloquear flujos solo de selector. pickFiles(), pickImages(), pickVideos(), o pickMedia() este permiso en Android 13+. Solo para Android.
requestPermissions Solamente solicite permisos de almacenamiento amplio o de medios. No solicite ni declare READ_MEDIA_IMAGES o READ_MEDIA_VIDEO Solo para utilizar APIs de selector. Google Play permite estas permisos solo cuando las alternativas de selector no son suficientes para la funcionalidad básica de la aplicación. @capgo/capacitor-file-picker Métodos del selector en lugar del acceso a archivo, imagen o video seleccionado por el usuario. Solo para Android.

Examples

pickFiles()

Selecciona uno o varios archivos desde el dispositivo.

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

Selecciona una o varias imágenes desde la galería. Solo disponible para 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()

Seleccione una o varias videos desde la galería. Solo para 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()

Pelea uno o más imágenes de la galería. Solo para 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()

Elige un directorio del dispositivo. Solo Android/iOS.

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

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

convertHeicToJpeg()

Convierte una imagen HEIC a formato JPEG. Solo 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 tabla anterior enumera los 9 métodos básicos. Los ayudantes de escucha y versión, así como el contrato completo de cada método, se documentan en el GitHub repositorio.

Escucha eventos

addListener devuelve un manejador. Llama handle.remove() cuando la pantalla se desmonta, o CapgoFilePicker.removeAllListeners() para eliminar todos los escuchas.

Referencia completa

Continúa desde @capgo/capacitor-file-picker

Si estás utilizando Usando @capgo/capacitor-file-picker conectarlo para planificar el almacenamiento y el manejo de archivos @capgo/capacitor-selector-de-archivos para los detalles de implementación en @capgo/capacitor-file-picker Getting Started para los detalles de implementación en Iniciar @capgo/capacitor-almacenamiento-de-datos-sqlite para los detalles de implementación en @capgo/capacitor-data-storage-sqlite Usando @capgo/capacitor-data-storage-sqlite para la capacidad nativa en Usando @capgo/capacitor-data-storage-sqlite, y @capgo/capacitor-archivo para los detalles de implementación en @capgo/capacitor-archivo.

FAQ

Preguntas Frecuentes del plugin File Picker

¿Cómo instalo el plugin File Picker en una aplicación Capacitor?

Ejecuta "bun add @capgo/capacitor-file-picker" (o "npm install @capgo/capacitor-file-picker"), luego ejecuta "bunx cap sync" para que los proyectos iOS y Android capturen el code nativo. Importa desde "@capgo/capacitor-file-picker" en tu aplicación code.

¿Funciona @capgo/capacitor-file-picker con React, Vue y Angular?

Sí. El paquete File Picker es un paquete Capacitor, por lo que funciona con cualquier framework web que se ejecute dentro de Capacitor, incluyendo Ionic, React, Vue, Angular, Svelte y JavaScript puro.

¿Qué versión de Capacitor soporta @capgo/capacitor-file-picker?

Capgo plugins siguen la versión mayor de Capacitor: utiliza la versión mayor del plugin que coincida con la versión mayor de Capacitor (por ejemplo, plugin v8 con Capacitor 8). La tabla de compatibilidad en el README del GitHub lista las versiones mantenidas.

¿Es @capgo/capacitor-file-picker gratuito y de código abierto?

Sí. El código code es público en GitHub en https://github.com/Cap-go/capacitor-file-picker/ y el paquete es gratuito para instalar desde npm. Se aceptan informes de errores y solicitudes de cambios.

¿Puedo actualizar code que utiliza File Picker sin una revisión de la Tienda de Aplicaciones?

Instalar o actualizar el plugin cambia el code nativo, por lo que necesita una nueva compilación de la tienda. Después de eso, los cambios en JavaScript, HTML y CSS que llaman al plugin pueden enviarlos instantáneamente con Capgo actualizaciones en vivo.

Envía cambios del selector de archivos sin esperar a la revisión de la aplicación

Una vez que el plugin esté en tu tienda de construcción, Capgo actualizaciones en vivo envían cambios en JavaScript, HTML y CSS a los usuarios en minutos.

Inicia con Capgo