ロックスクリーンカレンダー

当サイト「ウィジェットを作る」では、「シンプルカレンダー」の作り方を紹介しております。
「シンプルカレンダー」では、月曜スタートのカレンダーまで拡張したのですが、ここではさらに拡張したカレンダーを紹介します。
その拡張内容とは、「祝日表示」と「万年対応」です。
「iPhone4の棚」の頃からずっと練っていた構想ですので、ちょうど2年半掛かりの作品となります。
2年半か・・・
その大半を「祝日表示」に費やしました。
というのも、カレンダーは計算で表示しているので何とでもなるのですが、官報に依存する祝日もあるため、祝日のすべてを計算で表示することができません。
そこで、祝日をカレンダー.appに照会させ、生成されたカレンダーデータベースを読み取ることを考えました。
データベース言語(SQL)で、祝日だけでなく個人の予定も表示できると思ったのですが、W3CというWeb標準化団体が、HTML5の標準化の中でSQLiteを外してしまったのです。
この「SQLite」こそが、私の求めていたデータベースだったのですが、WebデータベースでSQLiteが使えないということは、予定だけでなく祝日すらiPhoneで取得できないという状況になりました。
そこで、目的を祝日取得に絞って考えた結果、照会するicsデータを加工することにしました。
これは、ネット上で取得することができるので、とても都合がいいのです。
パソコンでは「クロスドメイン」により取得できませんでしたが、iPhoneでは取得できましたので、当初の目的である祝日表示に辿り着くことが出来ました。
カレンダー自体は計算にによる表示ですので万年表示できますが、祝日はアップルが用意した祝日ファイルを利用していますので、現時点では2014年の祝日までしかありません。
このウィジェットでは、アップルが祝日データを更新することにかかっていることをご了承ください。

ウィジェットサンプル

iPhoneで閲覧している方は、サンプルをダブルタップすると拡大されますので、ウィジェット実行中の雰囲気を味わえるかと思います。
<注意> このサンプルはiPhone向けに作成したものですので、ご覧になっているブラウザによっては、上手く動作しないものや表示すらできないものもあります。
推奨ブラウザは、SafariかChromeです。

ロックスクリーン

カレンダー

保存する

←前年

←前月

翌月→

翌年→

ページトップへ

特徴

冒頭でも記述しましたが、当サイトの「シンプルカレンダー」に、さらに「祝日表示」と「万年表示」の機能を追加しました。
万年表示の切り替えアニメーションを多数用意し、メニューによる切り替え方式にしました。
お好きな曜日からスタートできるようにもしてあります。

更新履歴

2013/03/02 基本形完成
2013/03/04 祝日表示機能追加
2013/03/09 クロスドメイン対策
2013/03/14 ブラウザに少し対応
2013/03/15 イニシャルリリース
2013/03/18 スライドアニメーション仕様に変更
2013/03/25 キューブアニメーション仕様に変更
2013/04/10 アニメーション切り替え機能を追加
2013/04/13 曜日切り替え機能を追加
2013/05/01 天気予報の画像表示を追加
2013/06/09 文字列タップでも、アニメーション選択を可能にしました

ダウンロード

ダウンロードはこちら ーーー> スライド遷移ロックスクリーンカレンダー(ls_calendar_slide.zip)
ダウンロードはこちら ーーー> キューブ遷移ロックスクリーンカレンダー(ls_calendar_cube.zip)

ダウンロードはこちら ーーー> 完全版ロックスクリーンカレンダー(ls_calendar.zip)

使い方

何もしなければ、「今日」が該当する月が表示されます。
カレンダー上部に配置した4つのボタンで年と月が移動し、移動はアニメーションします。
そのアニメーションの種類は、カレンダー中央下部をタップ(クリック)することで出現するウィンドウで選択します。
カレンダーは一般的に日曜スタートですが、カレンダーの「曜日」部分をタップ(クリック)すると、その曜日でスタートするカレンダーになります。
アニメーションの種類やスタートする曜日は保存されますので、もしリブートしても初期値にどもることはありません。
カレンダー上部中央にある年月をタップ(クリック)すると、現在の年月に戻ります。
天気予報を表示する地域の変更は、当サイト「天気情報を表示する9」を参考にして、ソースを書き換えて下さい。
天気予報の表示は、iPhoneで確認して下さい。(このページでは表示されません)

カスタマイズポイント

3.5インチでもそのまま収まるように作りましたので、特にカスタマイズのポイントはありません。
アニメーションはそれぞれスタイルシートを分割しましたので、動きを変更したい方は、各スタイルシートをいろいろ弄って下さい。

今後の更新予定

基本的にはこれ以上の更新はありませんが、時間的に間に合わなかったり手間がかかるということで、盛り込んでいない機能があります。
日付部分がパラパラめくれるマルチフリップは、考えただけでも「重そう」という判断で後回しにしたので、軽快に動き自分も納得できる良い処理を思いついたら作り込もうと思っています。
1週間程度なら日付の横に天気予報(画像)を表示しても良いかなぁ?と思ったのですが、天気に関するウィジェットのページをアップしていないため、次の関連ページに1つも紹介できない状況に気付きました。
次のウィジェットは天気が関係するので、せっかくですから天気ウィジェットのページを更新しつつ、天気のウィジェットも作り、その中でカレンダーに使えそうな天気があれば、その段階でカレンダーに盛り込もうと思います。
もちろん、アニメーションや機能で何かしらの提案があれば、それも考慮して参ります。

サイト内関連ページ

シンプルなカレンダーを表示する
ホーム画面の壁紙を切り替える1(フェード編)
ホーム画面の壁紙を切り替える2(スライド編)
ホーム画面の壁紙を切り替える3(フリップ編)
ホーム画面の壁紙を切り替える4(キューブ編)
天気情報を表示する9(日本気象協会編1)
天気情報を表示する10(日本気象協会編2)
天気情報を表示する11(日本気象協会編3)
LockScreen Clock Hide
Wallpaper JPEGifier

ページトップへ

2013/04/14