Menggunakan @capgo/capacitor-calendar
Panduan @capgo/capacitor-calendar package ini memungkinkan aplikasi Capacitor mengelola event kalender native di iOS dan Android. Package ini bisa meminta izin kalender, membuat dan mengedit event, membuka UI kalender native, menampilkan daftar kalender dan event, serta mengelola Reminders di iOS.
Instal
npm install @capgo/capacitor-calendar
npx cap sync
Konfigurasi Izin Native
Di iOS, tambahkan deskripsi penggunaan yang dibutuhkan aplikasi Anda ke ios/App/App/Info.plist:
<key>NSCalendarsUsageDescription</key>
<string>This app needs calendar access.</string>
<key>NSCalendarsWriteOnlyAccessUsageDescription</key>
<string>This app needs permission to add calendar events.</string>
<key>NSCalendarsFullAccessUsageDescription</key>
<string>This app needs permission to read and manage calendar events.</string>
<key>NSRemindersFullAccessUsageDescription</key>
<string>This app needs permission to read and manage reminders.</string>
Di Android, tambahkan izin kalender yang dibutuhkan aplikasi Anda ke android/app/src/main/AndroidManifest.xml:
<uses-permission android:name="android.permission.READ_CALENDAR" />
<uses-permission android:name="android.permission.WRITE_CALENDAR" />
Request Permission
import { CapacitorCalendar } from '@capgo/capacitor-calendar';
const permission = await CapacitorCalendar.requestFullCalendarAccess();
if (permission.result !== 'granted') {
throw new Error('Calendar permission was not granted');
}
Create An Event
const startDate = Date.now() + 60 * 60 * 1000;
const endDate = startDate + 60 * 60 * 1000;
const { id } = await CapacitorCalendar.createEvent({
title: 'Product review',
location: 'Capgo',
startDate,
endDate,
description: 'Created with @capgo/capacitor-calendar',
});
console.log('Created event', id);
Buka UI Native Event
await CapacitorCalendar.createEventWithPrompt({
title: 'Planning session',
location: 'Office',
startDate: Date.now() + 24 * 60 * 60 * 1000,
endDate: Date.now() + 25 * 60 * 60 * 1000,
});
Daftar Event
const now = Date.now();
const { result: events } = await CapacitorCalendar.listEventsInRange({
from: now,
to: now + 7 * 24 * 60 * 60 * 1000,
});
Pengingat iOS
const permission = await CapacitorCalendar.requestFullRemindersAccess();
if (permission.result === 'granted') {
await CapacitorCalendar.createReminder({
title: 'Send launch notes',
dueDate: Date.now() + 2 * 24 * 60 * 60 * 1000,
});
}
Reminder hanya tersedia di iOS.
Referensi Lengkap
- GitHub: https://github.com/Cap-go/capacitor-calendar/
- Dokumentasi: /docs/plugins/calendar/