Saltar al contenido
Capgo

Getting Started

Este contenido aún no está disponible en tu idioma.

  1. Install the plugin

    Ventana de terminal
    npm i @capgo/capacitor-photo-library

  2. Sync platforms

    Ventana de terminal
    npx cap sync

Platform permissions

Section titled “Platform permissions”
  • iOS: Update Info.plist with NSPhotoLibraryUsageDescription (and NSPhotoLibraryAddUsageDescription if you plan to save media).
  • Android: For Android 13+, declare the photo/video permissions (READ_MEDIA_IMAGES, READ_MEDIA_VIDEO). Capacitor 5 handles this automatically, but double-check custom manifests.

Request access

Section titled “Request access”
import { PhotoLibrary } from '@capgo/capacitor-photo-library';


const { state } = await PhotoLibrary.requestAuthorization();
if (state !== 'authorized' && state !== 'limited') {
  throw new Error('Photo access denied');
}
Section titled “Load the gallery”
import { Capacitor } from '@capacitor/core';


const { assets, hasMore, nextPage } = await PhotoLibrary.getLibrary({
  limit: 100,
  includeAlbums: false,
  thumbnailWidth: 256,
  thumbnailHeight: 256,
});


const gallery = assets.map((asset) => ({
  id: asset.id,
  fileName: asset.fileName,
  created: asset.creationDate,
  thumbnailUrl: asset.thumbnail
    ? asset.thumbnail.webPath ?? Capacitor.convertFileSrc(asset.thumbnail.path)
    : undefined,
  photoUrl: asset.file
    ? asset.file.webPath ?? Capacitor.convertFileSrc(asset.file.path)
    : undefined,
}));

To fetch additional pages, call PhotoLibrary.getLibrary({ cursor: nextPage }).

Let users pick media

Section titled “Let users pick media”
const selection = await PhotoLibrary.pickMedia({
  selectionLimit: 5,
  includeVideos: true,
});


console.log('User selected', selection.assets.length, 'items');

Clean up cached files

Section titled “Clean up cached files”

Generated thumbnails and exports are stored in the app cache directory under photoLibrary. Remove them with your preferred file API when you need to reclaim storage.