Pasar al contenido principal
Volver a plugins
@capgo/capacitor-calendar
Tutoriales
@capgo/capacitor-calendar

Icono del calendario

Gestione eventos de calendario nativos en iOS y Android, con soporte de recordatorios de iOS

Demostración

Demos de WebP animados

Creación de eventos de calendario nativos en iOS y Android, exportados como demos de WebP animados.

Recursos de origen
Demo de iOS de creación de eventos de calendario nativos
Creación de eventos de iOS
Demo de Android de creación de eventos de calendario nativos
Creación de eventos de Android

Guía

Guía de tutoría de Calendario

Probar en dispositivo

Descargar la aplicación Capgo, luego escanea el código QR code.

Enlace de vista previa del plugin de calendario QR code

Usando @capgo/capacitor-calendar

El @capgo/capacitor-calendar El paquete permite a una aplicación Capacitor gestionar eventos de calendario nativos en iOS y Android. Puede solicitar permisos de calendario, crear y editar eventos, abrir la interfaz de usuario de calendario nativo, listar calendarios y eventos, y gestionar recordatorios en iOS.

Instalar

npm install @capgo/capacitor-calendar
npx cap sync

Configurar Permisos Nativos

En iOS, agregue las descripciones de uso que su aplicación necesita a 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>

En Android, agregue los permisos de calendario que su aplicación necesita a android/app/src/main/AndroidManifest.xml:

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

Solicitar Permiso

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

const permission = await CapacitorCalendar.requestFullCalendarAccess();

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

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

Abrir La Interfaz De Usuario De Evento Nativo

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

Lista de Eventos

const now = Date.now();

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

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

Los recordatorios solo están disponibles en iOS.

Referencia Completa