Titanium Mobileで作る！ iPhone／Androidアプリ

第19回　Android のカレンダーを操作してみる

Twitter リスト

2011年8月16日

倉井龍太郎

この記事を読むのに必要な時間：およそ 3 分

Android版でしか利用できない機能として，端末内蔵のカレンダーにアクセスする機能がTitaniumには実装されています。AndroidのカレンダーはGoogleアカウントのカレンダーと連動しており，Androidのカレンダーに変更を加えるとWeb上のGoogleカレンダーも同時に変更されるようになっています。GoogleカレンダーもAPIを持っていますが，Titaniumでは認証部分をAndroidに任せることでカレンダーへの操作を簡単に実装できます。

カレンダーの取得

Googleカレンダーには，一人のアカウントで複数のカレンダーが含まれています。“⁠会社用⁠”とか“⁠プライベート⁠”といった分け方もあり得ますし，第三者が作成したカレンダーをインポートしておくことで，“⁠日本の祝日・休日⁠”というカレンダーを持っている場合もあります。そこで，まずは自分のアカウントに存在するカレンダーを取得し，そこに指定されているイベントの一覧を表示してみます。

var win = Ti.UI.currentWindow;
var table = Ti.UI.createTableView();
var data = [];

var calendars = Ti.Android.Calendar.allCalendars;

for(var i=0;i<calendars.length;i++){
    var calendar = calendars[i];
    var row = Ti.UI.createTableViewRow({
         height: '60dp',
         'font-size': '20dp',
         color: 'black'
    });
    row.title = calendar.name;
    row.calendarObj = calendar; 
    data.push(row);
    
    row.addEventListener(
        'click',
        function(){
            var newWin = Ti.UI.createWindow({
                url: 'event_list.js',
                calendarObj: this.calendarObj
            });
            Ti.UI.currentTab.open(newWin);
        }
    );
}

table.setData(data);
win.add(table);

これだけでAndroid端末と紐づいてるGoogleアカウントのカレンダー名の一覧が表示できます。Ti.Android.Calendar.allCalendarsでカレンダーをすべて取得しているほかは，特に変わったコードはありません。取得できるカレンダーオブジェクトについては，name以外のパラメタも取得できますのでAPIリファレンスを参照してください。そしてカレンダーの中に含まれるイベントをすべて表示する部分が，rowオブジェクトのクリックイベントのイベントリスナに登録されている無名関数です。Windowとして開かれるevent_list.jsは次のようになっています。

var win = Ti.UI.currentWindow;
win.setBackgroundColor('#000');
var table = Ti.UI.createTableView();
var data = [];

var calendar = win.calendarObj;

var YEAR = 2011;

var events = calendar.getEventsInYear(YEAR);
for(var i=0;i<events.length;i++){
    var eventObj = events[i];
    var row = Ti.UI.createTableViewRow({
         height: '60dp',
         'font-size': '20dp',
         backgroundColor: 'white',
         color: 'black'
    });
    row.title = eventObj.title;
    
    row.eventObj = eventObj;
    row.addEventListener(
        'click',
        function(){
            var newWin = Ti.UI.createWindow({
                url: 'event_detail.js',
                eventObj: this.eventObj
            });
            Ti.UI.currentTab.open(newWin);
        }
    );
    data.push(row);
}

table.setData(data);
win.add(table);

こちらのコードもカレンダーの表示と似ていますが，カレンダーの取得にかわってcalendar.getEventsInYearで年内のすべてのイベントを取得するようにしています。このメソッドで取得できるイベントオブジェクトには，イベントの開始時間，終了時間などが含まれており，この情報も新しくWindowを開いて表示するようにしています。

日本の休日,祝日カレンダを表示したところ

イベントの詳細を表示する部分は次のようになります。

var win = Ti.UI.currentWindow;
win.setBackgroundColor('#000');
var table = Ti.UI.createTableView();
var data = [];

var e = win.eventObj;

var details = [
    e.title,
    e.description,
    e.begin.toLocaleString(),
    e.end.toLocaleString()
];

for(var i=0;i<details.length;i++){
    var detail = details[i];
    var row = Ti.UI.createTableViewRow({
         height: '60dp',
         'font-size': '20dp',
         backgroundColor: 'white',
         color: 'black'
    });
    row.title = detail;

    data.push(row);
}

table.setData(data);
win.add(table);

アラームの有無などイベントに設定されている値は多岐に渡るのですが，今回はイベントのタイトル，概要，開始時間，終了時間のみを取得しています。取得部分はdetailsという配列を生成している部分になります。

国民の休日の詳細を表示したところ

Titanium, Android, カレンダー, Google

著者プロフィール

倉井龍太郎（くらいりゅうたろう）

株式会社はてなアプリケーションエンジニア。

スマートフォンアプリからSQLチューニングまで幅広く格闘中。好きな言語はRuby。

URL：http://d.hatena.ne.jp/r_kurain/
Twitter：@kurain

バックナンバー