Passer à la navigation

Démarrer gratuitement

GitHub

Vous pouvez utiliser notre configuration assistée par l'IA pour installer le plugin. Ajoutez les Capgo compétences à votre outil IA en utilisant la commande suivante :

Fenêtre de terminal
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Utilisez ensuite la prompt suivante :

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

Si vous préférez la configuration manuelle, installez le plugin en exécutant les commandes suivantes et suivez les instructions spécifiques à la plateforme ci-dessous :

Fenêtre de terminal
npm install @capgo/capacitor-calendar
npx cap sync

Add the usage descriptions your app needs to 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 et plus récents distinguent entre accès écriture uniquement et accès complet au calendrier. Incluez uniquement les descriptions d'utilisation des rappels si votre application appelle les API des rappels.

Référence Apple : Migration vers les niveaux d'accès calendrier les plus récents.

Add the calendar permissions your app needs to android/app/src/main/AndroidManifest.xml:

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

Référence Android : Calendar Provider user permissions.

import { CapacitorCalendar } from '@capgo/capacitor-calendar';
const permission = await CapacitorCalendar.requestFullCalendarAccess();
if (permission.result !== 'granted') {
throw new Error('Calendar permission was not granted');
}

For apps that only add events, use requestWriteOnlyCalendarAccess()Pour les flux Android uniquement, utilisez requestReadOnlyCalendarAccess().

Les dates sont des timestamps Unix en millisecondes.

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);
await CapacitorCalendar.createEventWithPrompt({
title: 'Planning session',
location: 'Office',
startDate: Date.now() + 24 * 60 * 60 * 1000,
endDate: Date.now() + 25 * 60 * 60 * 1000,
});

On Android, prompt-based create and modify calls return null. Liste les événements à venir si vous devez trouver l'ID de l'événement créé.

const now = Date.now();
const oneWeekFromNow = now + 7 * 24 * 60 * 60 * 1000;
const { result: events } = await CapacitorCalendar.listEventsInRange({
from: now,
to: oneWeekFromNow,
});
const { result: calendars } = await CapacitorCalendar.listCalendars();
const { result: defaultCalendar } = await CapacitorCalendar.getDefaultCalendar();
const calendarId = defaultCalendar?.id ?? calendars[0]?.id;

selectCalendarsWithPrompt() Il est disponible sur iOS lorsque vous souhaitez afficher le sélecteur de calendrier système.

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

Les API de rappel sont uniquement disponibles sur iOS.

Le dépôt inclut un exemple d'application Capacitor avec des contrôles d'accès, la création d'événements, des invitations d'événements natives, la liste des calendriers et la liste des plages d'événements.

iOSAndroid
Demo iOS de création d'événements de calendrier natifDemo Android de création d'événements de calendrier natif

La référence complète de API est maintenue dans le fichier README et les définitions de types :