メイン コンテンツにスキップ

Getting Started

GitHub

AI-Assisted Setupを使用してプラグインをインストールできます。AIツールにCapgoスキルを追加するには、以下のコマンドを使用してください。

ターミナル画面
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

次のプロンプトを使用してください。

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

If you prefer Manual Setup, install the plugin by running the following commands and follow the platform-specific instructions below:

ターミナル画面
npm install @capgo/capacitor-calendar
npx cap sync

アプリに必要な使用方法の説明を追加してください 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 以降では、書き込み専用とフルカレンダー アクセスを区別します。リマインダー API を呼び出す場合のみ、リマインダー使用方法の説明を含めます。

Apple の参考資料: 最新のカレンダー アクセス レベルへの移行.

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" />

Android reference: 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(). For Android-only read flows, use requestReadOnlyCalendarAccess().

Dates are Unix timestamps in milliseconds.

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

__CAPGO_KEEP_1__

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

Android上では、プロンプトベースの作成と修正の呼び出しは nullイベントのリストが必要な場合は、作成されたイベントIDを探すためにイベントをリストアップします。

__CAPGO_KEEP_3__

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

__CAPGO_KEEP_4__

__CAPGO_KEEP_5__
const { result: calendars } = await CapacitorCalendar.listCalendars();
const { result: defaultCalendar } = await CapacitorCalendar.getDefaultCalendar();
const calendarId = defaultCalendar?.id ?? calendars[0]?.id;

selectCalendarsWithPrompt() 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はiOSのみです。

リポジトリには、Capacitorのサンプルアプリが含まれており、パーミッションチェック、イベントの作成、ネイティブイベントの提示、カレンダーの表示、イベントの範囲表示などが実装されています。

iOSAndroid
ネイティブカレンダーイベントのiOSデモネイティブカレンダーイベントのAndroidデモ

API リファレンスは、パッケージの README と TypeScript 定義で管理されています: