Getting Started
このプラグインのインストール手順とフルマークダウンガイドを含むセットアッププロンプトをコピーします。
Set up this Capacitor plugin in the project.
Use the package manager already used by the project.
Install these package(s): `@capgo/capacitor-calendar`
Run the required Capacitor sync/update step after installation.
Read this markdown guide for the full setup steps: https://raw.githubusercontent.com/Cap-go/website/refs/heads/main/apps/docs/src/content/docs/docs/plugins/calendar/getting-started.mdx
Use that guide for platform-specific steps, native file edits, permissions, config changes, imports, and usage setup.
If that guide references other docs pages, read them too.
インストール
ターミナルウィンドウnpm install @capgo/capacitor-calendarnpx cap synciOS セットアップ
セクション「iOS セットアップ」__CAPGO_KEEP_0__の使用方法を追加します。 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 の参考資料: 最新のカレンダー アクセス レベルへの移行.
Android セットアップ
セクション「Android セットアップ」__CAPGO_KEEP_0__のカレンダー権限を追加します。 android/app/src/main/AndroidManifest.xml:
<uses-permission android:name="android.permission.READ_CALENDAR" /><uses-permission android:name="android.permission.WRITE_CALENDAR" />Android の参考資料: カレンダー プロバイダーのユーザー権限.
カレンダー アクセスを要求
セクション「カレンダー アクセスを要求」import { CapacitorCalendar } from '@capgo/capacitor-calendar';
const permission = await CapacitorCalendar.requestFullCalendarAccess();
if (permission.result !== 'granted') { throw new Error('Calendar permission was not granted');}アプリケーションがイベントを追加するだけの場合に使用 requestWriteOnlyCalendarAccess()Android 限定の読み取りフローに使用 requestReadOnlyCalendarAccess().
イベントを作成
セクション「イベントを作成」日付はミリ秒単位のUnixタイムスタンプです。
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,});Android上では、プロンプトベースの作成と修正呼び出しは null必要に応じて作成されたイベントIDを探すためにイベントをリストアップします。
来週のイベント
「来週のイベント」タイトルのセクション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() iOS上でシステムカレンダーピッカーを表示したい場合に利用可能です。
iOS用のリマインダーを作成
「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', });}iOSのみのReminder APIです。
例のアプリ
例のアプリのセクションリポジトリには、許可チェック、イベントの作成、ネイティブのイベントの提示、カレンダーのリスト、イベントの範囲のリストなどを含むCapacitorの例のアプリがあります。
| iOS | Android |
|---|---|
![]() | ![]() |
APIのリファレンス
APIのリファレンスのセクションAPIの完全なリファレンスは、パッケージのREADMEとTypeScriptの定義で管理されています。

