GoogleスプレッドシートとGoogles Appps Script (GAS) を使ったテーブル形式フォームの一工夫例です。WEBアプリとして映し出すシートには、表計算の機能を使ってさまざまな情報を加工して表示させることができます。たとえば、何週間にもわたる予定表を作成した上で、常に直近の5週間だけを抜き取って表示させると、これは立派な「動的5週間表示カレンダー」アプリとなります。
以下にご紹介するのは、”今日”を起点に、現時点を含む1週間分、過去の週を1週間分、未来の週を3週間分、合わせて5週間分を表示させるアプリです。
単純なカレンダーだと、月末近くになった時に翌月の予定が(次のページなるので)分かりにくい欠点(私は”月跨ぎ問題”と言っています)がありますが、このアプリだとどんな場合でも向こう3週間の予定が見える利点があります。
作動状態をお見せします。
月がまたがっていても、前後5週間がいつもWEBサイトから手軽に確認できると便利だと思いませんか?
ちなみに元のデータは以下の様な別のシートです。全体の予定を記載しているこのシートから、スプレッドシートの表計算としての機能を活用して、5週間分の予定だけを抜き取ったシートを作り、さらにそれをWEBアプリとして表示させている訳です。
Googleスプレッドシートを活用したWEBアプリでは、このように表計算の機能を活用することで、スクリプトをそれほど複雑化させることなく、さまざまな機能を実現できます。
ここでは部活などのスケジュールに活用する事を想定して、練習日などを黄色く表示する様にしましたが、宜しければ自分だけのアプリにチャレンジしてみてください。
目次
「テーブル形式フォーム」を応用して、「動的5週間表示アプリ」を作ろう。
以下の記事を順に追っていただくと、GoogleスクリプトとGoogleスプレッドシートを使用して、動的5週間表示アプリを作る方法が分かります。
「テーブル形式フォーム」を基本としつつ、Googleスプレッドシートの表計算としての機能を活用することで、GASのコーディングは最小限の内容で済むようになります。
今回は、ひな型となるGoogleスプレッドシートもダウンロードできる様に用意しましたので、ご活用ください。
- 「動的5週間表示アプリ」の機能ご紹介です。表示例を示しています。先週が1行目、今週が2行目、その後の3週間予定が3~5行目となるカレンダーです。今日の日付が点滅しているのが判りますでしょうか。
- 表示させるデータを書き込んだ専用シートがどのようなものかご紹介しています。といっても単純に、1週間の予定を1行で表しただけの単なる表ですが・・・。ここから表計算の機能を使ってテーブル形式フォームで表示させるシートを自動作成しています。単純なデータ処理であれば表計算の機能を使ってノンプログラミングで処理できるのがGoogleスプレッドシートを使う利点です。
- ひな型となるスプレッドシートおよびGASのコードのご紹介です。テーブル形式フォームに表示させる際に、点滅させたり、セルを黄色くしたりする処理を加えています。