Panduan
Cara menggunakan Photo Library di Capacitor
Menggunakan @capgo/capacitor-photo-library
Plugin Capacitor menampilkan galeri foto sebagai halaman web, atau layar native membosankan yang tidak bisa dimodifikasi tetapi tidak memerlukan otorisasi.
Instal
bun add @capgo/capacitor-photo-library
bunx cap sync
bunx cap sync menyalin code native plugin ke dalam proyek native Anda. Jalankan kembali setiap kali melakukan upgrade plugin.
Impor
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
Sekilas tentang API
| Metode | Deskripsi |
|---|---|
checkAuthorization |
Mengembalikan status otorisasi saat ini tanpa memunculkan prompt kepada pengguna. |
requestAuthorization |
Meminta akses ke photo library jika diperlukan. |
getAlbums |
Mengambil album yang tersedia. |
getLibrary |
Mengambil aset library beserta URL yang dapat ditampilkan di web view. |
getPhotoUrl |
Mengambil URL yang dapat ditampilkan untuk versi resolusi penuh dari aset. Jika Anda sudah memanggil getLibrary dengan includeFullResolutionData, Anda biasanya tidak memerlukan metode ini. |
getThumbnailUrl |
Mengambil URL yang dapat ditampilkan untuk thumbnail aset yang sudah di-resize. |
pickMedia |
Membuka picker sistem native agar pengguna dapat memilih media tanpa memberikan akses penuh ke photo library. File yang dipilih disalin ke cache aplikasi dan dikembalikan dengan URL portabel. |
Contoh
checkAuthorization()
Mengembalikan status otorisasi saat ini tanpa memunculkan prompt kepada pengguna.
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
const result = await PhotoLibrary.checkAuthorization();
console.log(result);
requestAuthorization()
Meminta akses ke photo library jika diperlukan.
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
const result = await PhotoLibrary.requestAuthorization();
console.log(result);
getAlbums()
Mengambil album yang tersedia.
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
const result = await PhotoLibrary.getAlbums();
console.log(result);
getLibrary()
Mengambil aset library beserta URL yang dapat ditampilkan di web view.
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
const result = await PhotoLibrary.getLibrary();
console.log(result);
getPhotoUrl()
Mengambil URL yang dapat ditampilkan untuk versi resolusi penuh dari aset. Jika Anda sudah memanggil getLibrary dengan includeFullResolutionData, Anda biasanya tidak memerlukan metode ini.
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
const result = await PhotoLibrary.getPhotoUrl({ id: 'id-123' });
console.log(result);
getThumbnailUrl()
Mengambil URL yang dapat ditampilkan untuk thumbnail aset yang sudah di-resize.
import { PhotoLibrary } from '@capgo/capacitor-photo-library';
const result = await PhotoLibrary.getThumbnailUrl({ id: 'id-123' });
console.log(result);
Tabel di atas mencantumkan 7 metode inti. Listener, helper versi, dan kontrak lengkap setiap metode didokumentasikan di repositori GitHub.
Referensi lengkap
Lanjutkan dari Menggunakan @capgo/capacitor-photo-library
Jika Anda menggunakan Menggunakan @capgo/capacitor-photo-library untuk merencanakan perilaku media dan antarmuka native, hubungkan dengan @capgo/capacitor-photo-library untuk detail implementasi di @capgo/capacitor-photo-library, Panduan Memulai untuk detail implementasi di Getting Started, Menggunakan @capgo/capacitor-live-activities untuk kemampuan native di Menggunakan @capgo/capacitor-live-activities, @capgo/capacitor-live-activities untuk detail implementasi di @capgo/capacitor-live-activities, dan Menggunakan @capgo/capacitor-video-player untuk kapabilitas native saat menggunakan @capgo/capacitor-video-player.