Mulai

Instalasi

Anda dapat menggunakan Pengaturan Bantu AI kami untuk menginstal plugin. Tambahkan Capgo kemampuan ke alat AI Anda menggunakan perintah berikut:

npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Lalu gunakan prompt berikut:

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-calendar` plugin in my project.

Jika Anda lebih suka Manual Setup, instal plugin dengan menjalankan perintah-perintah berikut dan ikuti instruksi spesifik platform di bawah ini:

npm install @capgo/capacitor-calendar
npx cap sync

Pengaturan iOS

Tambahkan deskripsi penggunaan aplikasi yang Anda butuhkan untuk 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>NSRemindersUsageDescription</key>
<string>This app needs reminders access.</string>
<key>NSRemindersFullAccessUsageDescription</key>
<string>This app needs permission to read and manage reminders.</string>

iOS 17 dan lebih baru membedakan antara akses tulisan dan akses kalender penuh. Hanya termasuk deskripsi pengingat jika aplikasi Anda memanggil API Pengingat.

Referensi Apple: Migrasi ke tingkat akses Kalender terbaru.

Pengaturan Android

Tambahkan izin kalender yang dibutuhkan aplikasi Anda android/app/src/main/AndroidManifest.xml:

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

Referensi Android: Izin Pengguna Kalender Provider.

Minta Akses Kalender

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

const permission = await CapacitorCalendar.requestFullCalendarAccess();

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

Untuk aplikasi yang hanya menambahkan acara, gunakan requestWriteOnlyCalendarAccess(). Untuk aliran baca Android-only, gunakan requestReadOnlyCalendarAccess().

Buat Acara

Tanggal-tanggal adalah timestamp Unix dalam milisecond.

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

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 Editor Acara Asli

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

Pada Android, panggilan pembuat dan modifikasi berdasarkan permintaan kembali null. Daftar acara setelahnya jika Anda perlu menemukan ID acara yang dibuat.

Daftar Acara Masa Depan

const now = Date.now();
const oneWeekFromNow = now + 7 * 24 * 60 * 60 * 1000;

const { result: events } = await CapacitorCalendar.listEventsInRange({
  from: now,
  to: oneWeekFromNow,
});

Pilih Kalender

const { result: calendars } = await CapacitorCalendar.listCalendars();
const { result: defaultCalendar } = await CapacitorCalendar.getDefaultCalendar();

const calendarId = defaultCalendar?.id ?? calendars[0]?.id;

selectCalendarsWithPrompt() tersedia di iOS ketika Anda ingin menampilkan picker kalender sistem.

Buat Ingatan 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,
    notes: 'Created with @capgo/capacitor-calendar',
  });
}

API Ingatan hanya tersedia di iOS.

Contoh Aplikasi

Repository ini termasuk contoh aplikasi Capacitor dengan pengecekan izin, pembuatan acara, prompt acara native, daftar kalender, dan daftar rentang acara.

iOS	Android

Referensi API

Referensi API yang lengkap dipelihara dalam file README paket dan definisi TypeScript:

• README
• Definisi tipe