SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

Apache Cordovaで本格スマホアプリに挑戦しよう

カレンダーを管理するプラグインを使って、予定の追加と削除を行う

Apache Cordovaで本格スマホアプリに挑戦しよう 第13回

  • このエントリーをはてなブックマークに追加

 前回に引き続き今回も、スマートフォン内のカレンダーにアクセスするためのプラグインを紹介します。前回は、カレンダー自体の管理とそのカレンダーから予定を取得する方法を紹介しました。今回はカレンダーに予定を追加もしくは削除する方法を紹介します。

  • このエントリーをはてなブックマークに追加

対象読者

  • スマホアプリに挑戦したいと思っているWeb開発者
  • アプリ開発をもっと楽にしたいと思っている方
  • 業務スマホアプリを作る開発者

カレンダー内のイベントを管理する(1)

 前回に引き続き、図1のようなサンプルを通じて、イベントを追加・削除・変更する方法について紹介します。

図1 イベントの管理
図1 イベントの管理

カレンダーへのイベント登録

 カレンダーへイベントを作成する場合には表1のような4つのメソッドがあります。

表1 カレンダーにイベントを作成するメソッド
メソッド名 備考
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」が後ろに付くメソッドがあり、カレンダーの種類を指定したり、より詳細なイベント情報を指定したりできるようになっています。

表2 イベントを作成するメソッドの引数
プロパティ名 説明
title DOMString イベントのタイトルとして含まれる文字列
location DOMString 場所として含まれる文字列
notes DOMString メッセージ(メモ)として含まれる文字列
startDate Date イベントの開始日時
endDate Date イベントの終了日時
options Object カレンダー(calendarName)もしくはイベントのID(id)を指定する場合に 指定する
successCallback Function 取得できたときのコールバック関数
errorCallback Function 失敗したときのコールバック関数

 リスト1はイベントを登録するサンプルコードです。

リスト1 イベントの登録(js/controllers/EventController.jsの抜粋)
// (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がつくメソッドで指定できるオプションのプロパティは以下の通りです。

表3 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の場合)

会員登録無料すると、続きをお読みいただけます

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

次のページ
カレンダー内のイベントを管理する(2)

この記事は参考になりましたか?

  • このエントリーをはてなブックマークに追加
Apache Cordovaで本格スマホアプリに挑戦しよう連載記事一覧

もっと読む

この記事の著者

WINGSプロジェクト 小林 昌弘(コバヤシ マサヒロ)

WINGSプロジェクトについて>有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

山田 祥寛(ヤマダ ヨシヒロ)

静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for Visual Studio and Development Technologies。執筆コミュニティ「WINGSプロジェクト」代表。主な著書に「独習シリーズ(Java・C#・Python・PHP・Ruby・JSP&サーブレットなど)」「速習シリーズ(ASP.NET Core・Vue.js・React・TypeScript・ECMAScript、Laravelなど)」「改訂3版JavaScript本格入門」「これからはじめるReact実践入門」「はじめてのAndroidアプリ開発 Kotlin編 」他、著書多数

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/9929 2017/02/13 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング