Saltare al contenuto principale
Indietro ai plugin
@capgo/capacitor-calendar
Tutorial
@capgo/capacitor-calendar

Calendario

Gestisci eventi del calendario nativo su iOS e Android, con supporto per le notifiche di iOS

Demo

Demonstrazioni di WebP animate

Creazione di eventi di calendario nativi su iOS e Android, esportati come demonstrazioni di WebP animate.

Assetti di origine
Demo iOS di creazione di eventi di calendario nativi
Creazione di eventi iOS
Demo Android di creazione di eventi di calendario nativi
Creazione di eventi Android

Guida

Tutorial sul Calendario

Testa sul dispositivo

Scarica l'app Capgo, poi scansione il QR code.

Collegamento QR anteprima plugin del Calendario code

Utilizza @capgo/capacitor-calendar

Il @capgo/capacitor-calendar Il pacchetto consente a un'app Capacitor di gestire gli eventi del calendario nativo su iOS e Android. Può richiedere le autorizzazioni del calendario, creare e modificare gli eventi, aprire l'interfaccia utente del calendario nativo, elencare i calendari e gli eventi e gestire le Reminder su iOS.

Installa

npm install @capgo/capacitor-calendar
npx cap sync

Configura le autorizzazioni native

Su iOS, aggiungi le descrizioni di utilizzo che il tuo app necessita di 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>

Su Android, aggiungi le autorizzazioni del calendario che il tuo app necessita di android/app/src/main/AndroidManifest.xml:

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

Richiedi l'autorizzazione

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

const permission = await CapacitorCalendar.requestFullCalendarAccess();

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

Crea un evento

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

Apri l'interfaccia utente dell'evento nativo

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

Elenco gli eventi

const now = Date.now();

const { result: events } = await CapacitorCalendar.listEventsInRange({
  from: now,
  to: now + 7 * 24 * 60 * 60 * 1000,
});

Le Reminder sono disponibili solo su 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,
  });
}

La documentazione completa

Le Reminder sono disponibili solo su iOS.