跳过主要内容
返回插件
@capgo/capacitor-calendar
教程
@capgo/capacitor-calendar

日历

iOS 和 Android 上管理原生日历事件,支持 iOS 提醒事项

演示

动画 WebP 演示

iOS 和 Android 上原生日历事件创建,导出为动画 WebP 演示。

源资产
iOS原生日历事件创建示例
iOS事件创建
Android原生日历事件创建示例
Android事件创建

指南

日历教程

在设备上测试

下载Capgo应用,然后扫描QRcode。

日历插件预览二维码code

使用@capgo/capacitor-calendar

这个 @capgo/capacitor-calendar 包允许一个Capacitor应用程序在iOS和Android上管理本机日历事件。它可以请求日历权限、创建和编辑事件、打开本机日历UI、列出日历和事件以及在iOS上管理提醒。

安装

npm install @capgo/capacitor-calendar
npx cap sync

配置本机权限

在iOS上,添加您的应用程序需要的使用说明 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>

在Android上,添加您的应用程序需要的日历权限 android/app/src/main/AndroidManifest.xml:

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

请求权限

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

const permission = await CapacitorCalendar.requestFullCalendarAccess();

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

创建一个事件

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

打开本机事件UI

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

List Events

const now = Date.now();

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

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

iOS 提醒仅在 iOS 设备上可用.

全参考