GoogleのAppSheetで体重記録アプリを作ってみた。

日曜プログラマが新しいおもちゃを発見してしました。Googleのノーコードでのアプリが作成できるAppSheetです。作成画面が英語なのでとっつきにくい感じもありましたが、無料で使えていいおもちゃになりそうです。

作ってみたのはこんなアプリです
ざっくりした手順
手順の備忘的なメモ
対象のスプレッドシートの保護
作ってみて

作ってみたのはこんなアプリです

日々の体重が記録できるアプリです。体重の推移をグラフで見ることもできます。

こんなアプリがノーコードで作成できてしまいます。

ざっくりした手順

GoogleのスプレッドシートとAppSheetで作成します。

スプレッドシートでデータテーブルを作る
スプレッドシートからAppSheetアプリを起動させる
データテーブルの設定の調整をする
グラフの画面をViewとして追加する
IphoneやAndoroidにAppSheetのアプリを入れるとスマホからもアプリが使える。

こんな感じで簡単に作成ができました。（ググりながらですが、、、、。）

手順の備忘的なメモ

手順と言っても試行錯誤しながら作ったので覚えている範囲での備忘です。

スプレッドシートでのデータテーブルの作成

こんな感じで1行目を項目名として、A列に測定日時、B列に体重を入れました。
A列は「表示形式」⇒「数字」で表示形式を「日時」に設定しておきました。
B列は小数点以下1桁の表示にしておきました。

このシートがそのまま実際のアプリでもデータベースとして使われます。

AppSheetの起動

作ったスプレッドシートで「拡張機能」⇒「AppSheet」⇒「アプリを作成」と選ぶとAppSheetが起動してアプリが作成できます。

最初はログインやら何のアプリかを聞かれたような気がします。
ログインはスプレッドシートを作成している無料のGoogleアカウントで大丈夫でした。

データテーブルの調整

AppSheetの画面で一番左のアイコンで表のようなアイコンを選択するとデータテーブルの設定ができます。
スプレッドシートの内容から上手いこと設定してくれるようで、ほとんど触らなくても大丈夫でした。

データ項目の入力時の初期値の設定

データテーブルでいじったのは、体重列の初期値を追記しました。

初期値はデータの追加をする際の初期値となります。INITIALVALUEのところに入力します。ちなみに測定日時は最初から「Now()」が入っていました。

ここでは体重の初期値として「index(datasheet[体重],count(datasheet[体重]))」としておきました。Google先生でググってもあまりヒットしないので苦戦しました。

index(datasheet[体重],count(datasheet[体重]))の意味は以下の通りです。

datasheet[体重]：シート名[列の項目名]で指定した列の項目の配列です。

index：index(配列,　N)で配列のなかでN番目の項目を取り出します。最初の項目は1から始まるようです。
今回は「count(datasheet[体重]」で配列の要素数を指定することで体重のなかで最後に記録されたものを指定しています。

体重列の表示桁数の調整

体重の項目の桁数を調整しました。テーブルの鉛筆マークでカスタマイズができます。

ここでは黄色で囲った「Decimal digts」の項目で少数点以下の表示桁数を調整できます。今回は1にしておきました。

ちなみに青で囲った「Numeric digits」は整数部分の穴埋め桁数で例えば3桁を指定すると、入力値が4なら004、24なら024と不足部分がゼロで埋まります。

画面Viewの追加

画面の追加でグラフの画面を追加してみました。

画面左のスマホのようなアイコンの部分から、PRIMARY NAVIGATIONの横のプラスをクリックすると画面が追加できます。

今回は、Chertを選択して、Positionを2番目のnext、グラフのタイプを折れ線グラフにして、グラフの対象を体重と設定しました。

この設定でこんな感じでグラフが表示され、アプリの下のほうでデータ入力とグラフが切り替えられるようになりました。

上記以外でも、項目名や表示の変更やアイコンの変更などをしたように思いますが、細かいところまでは詳細に覚えてないですが、ざっとこのぐらいでそれっぽいものが出来上がると思います。

スマホでもアプリが使えます。

IphoneやAndoroidのスマホで「AppSheet」のアプリをストアからインストールしてアプリを作成したGoogleアカウントでログインすると、作成したアプリがスマホからも使えるようになります。

対象のスプレッドシートの保護

Appsheetで項目を入力したり削除するとスプレッドシートが更新されます。

ただ、スプレッドシートからも項目を削除したり追加できたりしてしまいますし、間違ってデータを書き換えてしまうということも起こりそうです。

ですので、シートを非表示にしておくとか、保護をかけておくということをしておいた方がいいように思います。

シートを保護するには、「データ」⇒「シートと範囲を保護」でシートタグをクリックしてから「権限を設定」ボタンで保護ができます。ただ、「編集時に警告を出す」か「編集者を限定する」ということしかできず、自分自身での入力を禁止するということはできないようです。
なので、事故を防止するにはシートを非表示にしておくほうがいいような気がします。