対象読者
- スマホアプリに挑戦したいと思っているWeb開発者
- アプリ開発をもっと楽にしたいと思っている方
- 業務スマホアプリを作る開発者
カレンダー内のイベントを管理する(1)
前回に引き続き、図1のようなサンプルを通じて、イベントを追加・削除・変更する方法について紹介します。
カレンダーへのイベント登録
カレンダーへイベントを作成する場合には表1のような4つのメソッドがあります。
| メソッド名 | 備考 |
|---|---|
| createEvent(title, location, notes, startDate, endDate, successCallba ck, errorCallback) | 非同期メソッドとしてイベントを登録 |
| createEventWithOptions(title, location, notes, startDate, endDate, op tions, successCallback, errorCallback) | 非同期メソッドとしてイベントを登録 |
| createEventInteractively(title, location, notes, startDate, endDate, successCallback, errorCallback) | 指定された値を元に外部アプリ(標準カレンダーアプリ)を起動 |
| createEventInteractivelyWithOptions(title, location, notes, startDate , endDate, options, successCallback, errorCallback) | 指定された値を元に外部アプリ(標準カレンダーアプリ)を起動 |
引数は表2の通りで、基本的には、前回紹介したfindEventメソッドと同じです。createEvent/createEventInteractivelyメソッドには、それぞれ「WithOptions」が後ろに付くメソッドがあり、カレンダーの種類を指定したり、より詳細なイベント情報を指定したりできるようになっています。
| プロパティ名 | 型 | 説明 |
|---|---|---|
| title | DOMString | イベントのタイトルとして含まれる文字列 |
| location | DOMString | 場所として含まれる文字列 |
| notes | DOMString | メッセージ(メモ)として含まれる文字列 |
| startDate | Date | イベントの開始日時 |
| endDate | Date | イベントの終了日時 |
| options | Object | カレンダー(calendarName)もしくはイベントのID(id)を指定する場合に 指定する |
| successCallback | Function | 取得できたときのコールバック関数 |
| errorCallback | Function | 失敗したときのコールバック関数 |
リスト1はイベントを登録するサンプルコードです。
// (1) カレンダーを指定する
var opts = window.plugins.calendar.getCalendarOptions();
opts.calendarName = 'Codezine'; // iOSの場合
opts.calendarId = '11'; // Androidの場合
// (2) イベントを登録
window.plugins.calendar.createEventWithOptions(
$scope.model.title, // タイトル
$scope.model.location, // 場所
$scope.model.memo, // メモ
$scope.model.startDate, // イベント開始日時
$scope.model.endDate, // イベント終了日時
opts,
function(message){
alert("OK :" + message);
},
function(message){
alert("NG :" + message);
}
);
// (3) 値を設定した状態でスマホのイベント登録画面を表示する
window.plugins.calendar.createEventInteractivelyWithOptions(
// : 省略
);
(1)ではイベントを登録するカレンダーを指定します。AndroidとiOSで指定方法が異なります。Androidの場合、IDにはlistCalendarメソッドで取得した時のidを指定し、iOSではカレンダー名を指定します。従って、実際にはDeviceプラグインなどを使ってOSごとに処理を分ける必要があります。
(2)のcreateEvent(WithOptions)は、指定された情報でイベントを登録しますが、(3)のようにcreateEventInteractively(WithOptions)を利用すれば、スマホの標準カレンダーアプリのUIを使って登録できます。
(1)のようなオプションで指定できるプロパティについては、カレンダー以外にも表3の内容があります。これらの詳細な動作を知るにはAPIを調べるよりも、他のカレンダーアプリを使って、どのような設定項目があるのか、ということについて調べるとわかりやすいはずです。WithOptionsがつくメソッドで指定できるオプションのプロパティは以下の通りです。
| プロパティ名 | 型 | 説明 |
|---|---|---|
| firstReminderMinutes | Number | 最初のリマインダ(アラーム)の時間設定 |
| secondReminderMinutes | Number | 2回目のリマインダ(アラーム)の時間設定 |
| recurrence | DOMString | 繰り返しイベント(daily, weekly, monthly, yearlyのいずれか) |
| recurrenceEndTime | Date | 繰り返しを終了する日時 |
| recurrenceInterval | Number | 繰り返す間隔。recurrence = 'daily'ならば 3を指定すると3日という意味に なる。 |
| calendarName | DOMString | カレンダー名(iOSの場合) |
| calendarId | DOMString | カレンダーID(Androidの場合) |
| url | DOMString | URL(iOSの場合) |
