AppSheetで爆速ノーコードアプリ開発 その４ - 検温履歴の項目設定

カカト@ノーコード開発推しです。

「AppSheetで爆速ノーコードアプリ開発」と題して、ノーコードアプリ開発ツール 「AppSheet」の基本的な使い方の説明を連載形式で投稿しています。

いわゆるハンズオン形式になるよう、画面付きで＆わかりやすく解説していくようにします。もし不明な点がありましたら、コメント頂ければ回答するようしますのでよろしくお願いします。

四回目となる今回は、前回に続きアプリで使うデータの項目を設定していきます。

・検温履歴の項目設定

検温履歴の項目設定

今回のゴールですが、検温履歴データの項目設定まで完了させたいと思います。設定する前に、完成形をお見せします。

前回設定したプロフィール項目では、Typeに ImageやDecimalを指定しましたが、今回はそれに加えてDateTimeやEnum等の型を使いつつ、プロフィールのテーブル（＝シート）と結合してプロフ画像と平熱を表示してみたいと思います。併せて、項目の入力制御も設定していきます。

まずは「Columns」タブをクリックし、「検温履歴」をクリックします。

プロフィールの時と同様に、AppSheetの方で自動的に列の型（Type）が設定されていますが、全てText（文字列型）になっていますので手動で設定変更していきましょう。

まずは、「記録日時」を設定します。

記録日時列の右にある、鉛筆アイコンをクリックし詳細画面を開きます。

「Type」に、「DateTime」を指定し、その下にあるType Detailsの「Ignore seconds」をチェックします。

DateTimeにすることで、日時（年月日時分秒）形式の入力項目にすることができますが、秒は不要にしたいので、Ignore seconds（秒を無視）しています。

設定が終わりましたら、詳細画面上にある Done ボタンを押します。

一覧画面に戻りますので、続けて「体温」列の詳細画面を開きます。

「Type」を「Decimal」に変更し、小数点以下の入力をできるようにします。

下にスクロールし、プロフィールの平熱と同様に、Minimum value（入力最小値）、Increase / decrease step（+/-ボタンを押したときに増減する値）、Decimal digits（小数点以下の桁数）を入力します。

終わりましたら、Doneボタンを押して一覧に戻ります。

続けて、「調子」列を設定します。

調子列ですが、ユーザーによるテキスト入力ではなく、候補を表示して選択してもらうようにしたいと思います。

鉛筆マークをクリックし、詳細画面を開きます。

「Type」に「Enum」を選択し、その下にあるType Detailsの「Add」ボタンをクリックし、"良好"、"少し悪い"、"かなり悪い" と３つ追加していきます。 

enumですが、"Enumerated Type" の略で、"列挙型"を意味します。JavaやC#などのプログラミング言語の経験がある方は馴染み深いと思いますが、簡単に説明すると「複数の定数値をひとまとめにすることができるデータ型」を意味します。

ここでは、"良好"、”少し悪い"、"かなり悪い"といった３つの定数（変更できない値）を作成し、それをひとまとめにした形で調子列に設定しています。

Enum列ですが、「Input mode」という項目を使うことで画面に表示する形式を指定することができます。

AppSheet側で「Auto」が自動的に選択されていますが、これをStack（縦並びのボタン）やDropdown（プルダウン形式）に変えることもできますので、気に入ったものを選んでください。（ちなみにAuto = Buttons側で設定されています）。

終わりましたら、Doneボタンを押して一覧に戻ります。

最後に、「備考」列のTypeを一覧より、「LongText」に変更します。

LongTextにすることで、複数行の文字列を入力することができます。

プロフィールの項目を表示する

検温履歴の「ユーザー名」ですが、ここはユーザーによる入力ではなく、プロフィールに設定したユーザー名から選択できるようにしていきます。

併せて、プロフィールに設定したプロフ画像と平熱を表示項目として、検温履歴画面に出力してみたいと思います。

これをするためには、検温履歴のテーブルと、プロフィールのテーブルを結合する必要がありますが、AppSheetではTypeに「Ref」という型を設定することでノーコードで実装することができます。

ユーザー名列の鉛筆マークをクリックし詳細画面を開きます。

「Type」を「Ref」に変更すると、下にあるType DetailsでSource Tableという項目が表示されますので、そこに「プロフィール」を指定します。

Source tableには、この項目がどのシート（テーブル）の項目を参照するかを指定することができ、この例だと "検温履歴のユーザー名" と "プロフィールのユーザー名"をキーとして結合し、プロフィールの情報を取得することができます。

「テーブルの結合」についてピンと来ない方は、以下のサイトの記事が参考になりますのでURLを貼っておきます。

テーブル結合（JOIN) とは
https://wa3.i-3-i.info/word15318.html

なお、ノーコード開発ではSQLなどの、データの抽出や編集する処理のコーディングは不要ですが、テーブルやリレーションの知識は必要ですので併せて学習することをお勧めします。

なお、以降の説明では、プロフィールや検温履歴など、スプレッドシートよりシートとして読み込んだモノについては、「表」という形で記していきます。

さて、検温履歴表とプロフィール表が結合できましたので、次はプロフィール表よりプロフ画像と平熱を取得し、検温履歴の画面に表示しようと思います。

検温履歴表の右上にある、「Add Virtual Column」ボタンをクリックします。

詳細画面が開くので、「Column name」に プロフ画像 と入力し、「App formula」の イコールの部分をクリックし、

[ユーザー名].[プロフ画像]

と入力します（四角カッコで括り、間にピリオドを入れてください）。

終わりましたら Done ボタンを押して一覧に戻ります。

「Virtual Column」は、スプレッドシートに実際に存在する列ではなく、AppSheetの関数を使い表示することができる疑似的な"読取り専用の列"を意味します。

ここでは、先ほど作成したユーザー名列での結合を使い、プロフィール表よりプロフ画像を取得し、Virtual Column として追加しました。

なお、Virtual Columnを追加しても実際のシートには項目は追加されません。
また、事前にRef列でテーブルを結合しておかないと、いい感じに値は取得できませんのでご注意ください。

ではもう一つVirtual Columnを追加しましょう。

画像と同じように、Virtual Column ボタンをクリックし、詳細画面に以下のように入力します。

・Column name：平熱
・App formula：[ユーザー名].[平熱]
・Type：Decimal 

これで、プロフィール表の平熱が表示されるようになりました。

初期値の設定

今回、初めてAppSheetの関数（App formula）に触れました。せっかくなので、App formulaを使い、項目初期値の設定方法について説明します。

検温履歴表の「記録日時」に、初期値として現在日時を表示してみましょう。

「記録日時」列の鉛筆マークをクリックし、詳細画面を開きます。

開いたら、下にスクロールしたところにある「Data Validity」をクリックし表示を展開します。

"Auto Complete" の、「Initial value」にあるイコールサインをクリックしてください。

Expression Assistant という、関数入力の画面が開きますので、そこに

NOW()

と入力し、右下のSaveボタンを押します。

詳細画面に戻りますので、Doneボタンを押して画面を閉じます。

これで、登録時の初期値として現在日時が表示されるようになります。

なお、結合した表の値を初期として表示することもできます。

以下は、「体温」の初期値にプロフィール表の平熱を設定するようにしました。

こうすることで、検温履歴の新規登録時、ユーザー名を選択したタイミングでユーザーの平熱が自動的に表示されるようになります。

この設定は任意ですので、時間がありましたら設定してみてください。

表示/非表示の切替や必須チェックを実装

最後に、各項目の表示・非表示と、入力必須チェックを実装していきます。

AppSheetでは項目単位で項目の表示・非表示の切替や、入力必須のチェックを一覧より簡単に設定することができます。

一覧を少し右にスクロールすると、SHOW?（画面表示有無）、EDITABLE（編集可否）、REQUIRE?（入力必須チェック有無）のチェックボックスが出ますので、以下のように設定します（列名が切れてしまい見にくくすみません・・）。

ここでは、「_RowNumber」列のSHOW?のチェックを外し、非表示にしているのと、ユーザー名から調子までの列に必須チェックを付けました。

なお、_RowNumber列ですが、これは表の行を一意にするための識別値を保持する行になります。今後の説明で詳細説明します。

これで、検温履歴の項目設定は完了です。
この段階で、画面左上のSAVEボタンを押して、保存しておきましょう。

ここで検温履歴を登録してみましょう。

お詫び：執筆時にスクショを撮り忘れたため、実装後の画面となります。調子ボタンに顔アイコンが付いている点以外は同じと思いますので、顔アイコンの部分は無視してください。

ユーザー名より、ユーザーを選ぶと以下のような感じで表示されます。

AppSheet、ここまで触ってみてどうでしょう？

簡単ですよね。

英語が苦手な方は少々とっつきにくさはあるかもしれませんが、大体弄る項目は決まっていたりしますので、慣れてしまえば気にならないかも？です。

それでもヘルプやフォーラムは全て英語ですので、辞書や翻訳サイトは必要ですが・・。

次回予告

長くなりすみません。

プロフィール表、検温履歴表の項目設定が終わりましたので、次回から画面の設定をしていきます。

次回の投稿は以下の内容を予定しています。

・プロフィール一覧画面の作成