【AppSheet】Googleカレンダーの連携

はじめに

AppSheetで予定表を作成し、Googleカレンダーに転記する方法を紹介します。
ここではBehaviorのActionで実装していますが、AutomaitionのBotでも可能かと思います。

新しいAppを用意する

AppSheetのHome画面から、新しいAppを作成します。

https://www.appsheet.com/home/apps#owned

新しいAppの作成

1. 「Create」ボタンを押し、「App」から「Blank app」を選択します。
2. 「App name」欄にアプリの名前（今回は「予定表」と付けています）を入力して、「Category」のリストの中から適当なものを選択します。
3. 「アプリの準備ができたよ！」の画面が出てくるので、「Customaize your app」を押す。

デフォルトのテーブル

4. すでにデフォルトのテーブルが一つ用意された状態でエディタ画面が表示されます。個人的にはエディタ画面は「legacy editor」の方が好きなので、右上の四角の中に目が入っているようなアイコンで切り替えます。

デフォルトのテーブルとビューの削除

5. デフォルトで用意されているテーブルとビューを削除します。

テーブルもビューもない状態

テーブルを準備する

スプレッドシートで予定を管理するテーブルを作成します。

マイドライブに生成されたフォルダ

1. マイドライブの直下に、「/appsheet/data/予定表-（シリアルナンバー）」のフォルダが生成されているので、スプレッドシートで新規にテーブルを作成する。

テーブルのカラムの設定

2. スプレッドシートの1行目にデータを格納していくカラム（列）を設定します。

• Keyを設定するカラム（赤）
  • ID予定表：レコード（行）の固有の値＝Key
• レコードを管理するためのカラム（緑）
  • 作成日時：レコードを作成した年月日時間
  • 作成日：レコードを作成した年月日
  • 作成時間：レコードを作成した時間
  • 編集日時：レコードを編集した年月日時間
  • 編集日：レコードを編集した年月日
  • 編集時間：レコードを編集した時間
  • メモ：レコードに関するメモ書き
  • フラグ：動作確認用のフラグ
• データを記録するためのカラム（白）
  • タイトル：カレンダーに記録する予定のタイトル
  • 開始日：予定の開始日
  • 開始時間：予定の開始時間
  • 終了日：予定の終了日
  • 終了時間：予定の終了時間
  • 場所：予定が行われる場所
  • 説明：予定の説明

シートのタグにもテーブル名（予定表）に変更するのを忘れないようにして下さい。
※図の赤枠の箇所

テーブルの新規作成

3. DataのTablesタグからNew Tableボタンを押して、新しくテーブルを作成します。
4. Add dataでGoogle Sheetsを選択します。
5. 2で作成したシート（予定表）を選択し、Selectボタンを押します。
6. Create a new tableで内容を確認し、Add This Tableボタンを押します。

カラムの設定

7. 予定表のテーブルのView Columnsを押して、カラムの設定画面を開きます。詳細設定画面とプレビュー画面の間にある「▶」のボタンを押すと、プレビュー画面が閉じて詳細設定画面が広くなるので、編集作業がしやすくなります。
8. 各カラムを以下のように設定します。
   「VC開始」と「VC終了」というバーチャルカラムも、「Add Virtual Column」のボタンを押して、設定します。

NAME	TYPE	KEY	LABALE	FORMULA	SHOW	EDITABLE	REQUIRE	INITIAL_VALUE	DISPLAY_NAME	DESCRIPTION
_RowNumber	Number	☐	☐	=	☐	☐	☐	=	=	=Number of this row
ID予定表	Text	☑	☐	=	☑	☑	☑	=UNIQUEID()	=	=
作成日時	DateTime	☐	☐	=	☐	☑	☐	=NOW()	=	=
作成日	Date	☐	☐	=	☐	☑	☐	=DATE([作成日時])	=	=
作成時間	Time	☐	☐	=	☐	☑	☐	=TIME([作成日時])	=	=
編集日時	ChangeTimestamp	☐	☐	=	☐	☑	☐	=	=	=
編集日	Date	☐	☐	=DATE([編集日時])	☐	☑	☐	=	=	=
編集時間	Time	☐	☐	=TIME([編集日時])	☐	☑	☐	=	=	=
メモ	LongText	☐	☐	=	☑	☑	☐	=	=	=
フラグ	Yes/No	☐	☐	=	☑	☑	☐	=	=	=
タイトル	Name	☐	☑	=	☑	☑	☑	=	=	=
開始日	Date	☐	☐	=	☑	☑	☑	=TODAY()	=	=
開始時間	Time	☐	☐	=	☑	☑	☑	=	=	=
終了日	Date	☐	☐	=	☑	☑	☑	=TODAY()	=	=
終了時間	Time	☐	☐	=	☑	☑	☑	=	=	=
場所	Text	☐	☐	=	☑	☑	☐	=	=	=
説明	LongText	☐	☐	=	☑	☑	☐	=	=	=
VC開始	DateTime	☐	☐	=[開始日]&" "&[開始時間]	☑	☐	☐	=	=開始	=
VC終了	DateTime	☐	☐	=[終了日]&" "&[終了時間]	☑	☐	☐	=	=終了	=

9. SAVEボタンを押して、設定を保存します。

セーブをしたら、「作成日時（作成日、作成時間、編集日時、編集日、編集時間）が非表示に設定されたので、SEARCHからチェックを外しました」という警告が出ていますが、いずれ消えますので気にしないで下さい。

テーブルのビューを設定する

予定表テーブルのビューを設定します。ビュータイプはtableにしています。

ビューの設定

次に、「Show system views」ボタンを押して、詳細を表示するビュー「予定表_Detail」、入力をする時のビュー「予定表_Form」を表示させて、「予定表_Form」を設定します。

「Show systemu views」ボタン

入力フォームビューの設定

OptionsタブからFormの設定が変更できます。「Form style」を「Default」から「Side-by-side」に変更すると、下図のように入力枠の左側に入力項目名が表示され、1画面に表示される項目数が増えます。

Formのオプション設定

試しに入力フォームからいくつかの予定を入力し、表示状態を確認します。
予定表の表示ビュー設定の「Column width」を「Default」から「Narrow」に変更すると、表の列幅がいい感じで狭くなります。

予定表ビューの確認

Googleカレンダーの準備

AppSheetと連携させるGoogleカレンダーを準備します。
マイカレンダーとは別に新しいカレンダーを用意して、予定表と連携させます。

新しいカレンダーの作成

1. Googleカレンダーの「他のカレンダー」の＋ボタンを押して、他のカレンダーを追加します。
2. 「新しいカレンダーを作成」を選択します。
3. 「新しいカレンダーを作成」画面で名前（ここでは「G連携カレンダー」にしています）をつけます。また、タイムゾーンを「日本標準時」に設定し、「カレンダーを作成」ボタンを押します。
4. マイカレンダーの下に新しく作成したカレンダーが表示されたのを確認します。

新しいソースの追加

5. AppSheetにGoogleカレンダーをソースデータとして追加します。
   まず、New Tableボタンを押します。
6. 「+New source」ボタンを押します。
7. 「Add a new data source」から「Google Calendar」を選択します。
8. アカウントの選択で、先程用意したカレンダー（G連携カレンダー）のアカウントを選択します。
9. 「Google AppSheetがGoogleアカウントへのアクセスをリクエストしています」と表示されるので、「許可」のボタンを押します。

Googleカレンダーをテーブルとして取り込む

10. Googleカレンダーがソースに追加されましたので、再び、New tableボタンを押し、「Google Calendar」を選択します。
11. 「Choose a Sheet/Table」で用意しておいたカレンダー（G連携カレンダー）を選択します。
12. 「Create a new table」で「Add This Table」ボタンを押します。

取り込んだGoogleカレンダーのテーブル

Googleカレンダーをテーブルとして取り込むことができました。
カラムの設定を変更していいかどうか、正直、よく分かりませんので、そのまま使うことにします。

カレンダービューの設定

取り込まれたカレンダーのビューはmapタイプ^[1]になっていますので、calendarタイプに変更します。

mapタイプで追加されたカレンダーのビュー

View typeを「calendar」に変更して、View Optionsを下図のように設定します。

G連携カレンダービューの設定

プレビュー画面のカレンダーから予定を登録して、Googleカレンダーに反映されるか確認します。
Googleカレンダーの方からも予定を変更したり、削除したりするとAppSheet側のカレンダーも変更されます。

AppSheetとGoogleカレンダーの連携の確認

予定をG連携カレンダーに転記するActionを作成する

いよいよ最後の工程です。
予定表に入っている予定を、G連携カレンダーに転記するActionを作成します。
1つ1つの予定ごとにボタンを押して転記する方法もあるのですが、ここでは転記したい予定を複数選択して、一括で転記する方法を実装します。
作成するActionは2つです。

• 「Data : add a new row to another table using values from this row」を使って、予定をG連携カレンダーに転記するアクション
• 「Data : execute an action on a set of row」を使って、選択した予定を一括で操作するアクション

予定をG連携カレンダーに転記するAction

1. BehaviorのActionsタブからNew Actionボタンを押し、Add a new actionで「Create a new action」ボタンを押して、予定をG連携カレンダーに転記するActionを作成します。
   設定は以下の通りです。

• Action name：予定をG連携カレンダーに連携する
• For a record of this table：予定表
  （対応するテーブル）
• Do this：Data : add a new row to another table using values from this row
  　（対応するテーブルの値を使って、他のテーブルに新しい行を追加する）
• Table to add to：G連携カレンダー
  （行を追加するテーブル）
• Set these columns（セットするカラム）

G連携カレンダー	←	予定表
Title	←	[タイトル]
Start	←	[VC開始]
End	←	[VC終了]
Location	←	[場所]
Description	←	[説明]

• Prominence：Do not display（非表示）

一括転記するAction

2. 一括転記するActionを作成します。
   設定は以下の通りです。

• Action name：一括転記
• For a record of this table：予定表
  （対応するテーブル）
• Do this：Data : execute an action on a set of row
  　（選択された行に対し実行する）
• Referenced Table：予定表
  （参照するテーブル）
• Referenced Rows：LIST([ID予定表])
  （参照する行：複数の行を選択するので、リストタイプで指定します。）
• Referenced Action：予定をG連携カレンダーに転記する
  （参照するアクション）
• Prominence：Display inline（インラインに表示）

予定表テーブルで動作するAction

3. 予定表テーブルに2つのアクションが正常に動作するか確認します。
   プレビュー画面の予定表ビューから、右上のチェックボックス（☑）を押します。

G連携カレンダーに転記する予定を選択する

4.予定表の行の先頭にチェックボックス（☐）が表示されるので、転記する予定にチェック（☑）を入れて、右上の縦3点リーダーを押します。

縦3点リーダーのメニュー

5. 縦3点リーダーのメニューが開かれるので、「一括転記」を選択します。

AppSheetのG連携カレンダーとGoogleカレンダー

選択した4つの予定がAppSheet側のG連携カレンダーと、Googleカレンダーの両方に転記されました。
以上でAppSheetとGoogleカレンダーの連携の一例についての説明を終わります。
長文になりましたが、最後まで閲覧して頂き有難うございます。

追加情報

カレンダー表示期間のデフォルトの設定

DataメニューのTablesタブ内のSTORAGEにあるWorksheet Name/Qualifierを参照してください。
デフォルトでは、カレンダーの表示期間を「-90」～「+90」日間で設定されています。
この「-90」や「90」の値を変更することで、表示期間を変更することができます。

脚注

1. カレンダーのLocationに正しい場所の名前や位置情報が入っていれば、Googleマップでの表示も可能です。