Skip to content

시작하기

터미널 창
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 이상부터는 쓰기 전용 및 전체 캘린더 접근 권한을 구분합니다. 你的 앱이 Reminders API를 호출하는 경우에만 알람 사용 설명서를 포함하세요.

Apple 참조: 최신 캘린더 접근 권한으로 마이그레이션.

Android 설정

Android 설정

앱이 필요로 하는 캘린더 권한을 추가하세요. 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(). 안드로이드 전용 읽기 흐름을 사용하세요. 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,
});

안드로이드에서 프롬프트 기반 만들기 및 수정 호출은 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에서 시스템 캘린더 픽커를 보여주고 싶을 때 사용할 수 있습니다.

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 Reference

API 참조 섹션

API 참조의 전체 내용은 패키지 README와 TypeScript 정의에서 유지됩니다.