Kalender

Menggunakan @capgo/capacitor-kalender

Kalender @capgo/capacitor-calendar package memungkinkan sebuah aplikasi Capacitor mengelola acara kalender native pada iOS dan Android. Ini dapat meminta izin kalender, membuat dan mengedit acara, membuka antarmuka kalender native, menampilkan kalender dan acara, serta mengelola Pengingat pada iOS.

Instal

npm install @capgo/capacitor-calendar
npx cap sync

Konfigurasi Izin Native

Pada iOS, tambahkan deskripsi penggunaan aplikasi yang dibutuhkan oleh 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>

Pada Android, tambahkan izin kalender aplikasi yang dibutuhkan oleh android/app/src/main/AndroidManifest.xml:

<uses-permission android:name="android.permission.READ_CALENDAR" />
<uses-permission android:name="android.permission.WRITE_CALENDAR" />

Meminta Izin

import { CapacitorCalendar } from '@capgo/capacitor-calendar';

const permission = await CapacitorCalendar.requestFullCalendarAccess();

if (permission.result !== 'granted') {
  throw new Error('Calendar permission was not granted');
}

Membuat Acara

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

Membuka Antarmuka Acara Native

await CapacitorCalendar.createEventWithPrompt({
  title: 'Planning session',
  location: 'Office',
  startDate: Date.now() + 24 * 60 * 60 * 1000,
  endDate: Date.now() + 25 * 60 * 60 * 1000,
});

Menampilkan Acara

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,
  });
}

Pengingat hanya tersedia pada iOS.

Referensi Lengkap

• GitHub: https://github.com/Cap-go/capacitor-calendar/
• Docs: /docs/plugins/calendar/