AppSheetで請求書アプリ(第3回)リレーションシップで親子関係を設定

folder_openAppSheet

請求書アプリを作りながら、AppSheetの使い方を学びましょう。
前回(第2回)はスプレッドシートからアプリを生成し、テーブルと列の設定を行いました。
今回はリレーションシップを使用してテーブル間の親子関係を設定します。
請求書に限らず、リレーションシップの概念はアプリ開発に必須ですが、AppSheetでもテーブル間のリレーションシップ設定ができるんです!

1. 請求書に品目明細を追加する

請求書には品目、単価、数量、金額、合計金額などの明細、品目明細が必要です。
第2回でテーブルと列の設定を行いましたが、現時点では品目明細を請求書に追加できないようになっています。

プレビュー画面で「請求書」を表示し、「+」ボタンで請求書作成フォームを表示すると以下のようになっています。
品目を追加するフィールドは表示されません。

この時点でAppSheetアプリに「品目」を追加するフィールドはない。

請求書に品目明細を追加するためには、リレーションシップを利用してテーブル間の親子関係をAppSheetで設定する必要があります。
タスク管理アプリでも「タスク」テーブルと「ノート」テーブル、「ドライブ」テーブルに親子関係を設定しています。
請求書アプリでは、請求書と品目明細の親子関係は特に重要ですので、詳しく解説していきます。

2. AppSheetでは「Ref」で親子関係を設定する

請求書と品目明細の関係は、請求書が親、品目明細が子になります。
請求書アプリでは、「請求書」テーブルが親、「品目」テーブルが子になります。

請求書と品目の親子関係。

AppSheet では、列TYPEに「Ref」を設定することでテーブル間のリレーションシップを設定します。
前回(第2回)で、「品目」テーブルに「請求書ID」という列を用意しました。

AppSheet列設定パネルで列TYPE「Ref」の列を設定する。

この「請求書ID」列には、「請求書」テーブルの「ID」の値を保存しておき、「品目」テーブルと「請求書」テーブルとのリレーションシップが設定されます。

では、このリレーションシップを利用して、「請求書」テーブルと「品目」テーブルとの間に親子関係を設定しましょう。
AppSheetにおけるテーブル間の親子関係は以下のように設定します。
請求書アプリでは、前回(第2回)の設定で1と2は済んでいます。

テーブル間の親子関係の設定
  1. 子テーブル内に列TYPE「Ref」の列を用意する
  2. 列設定パネルで、Type Detailsの「Source table」に親テーブルを設定する
  3. 「Is a part of ?」をチェックする

では設定の残り、3の「Is a part of ?」にチェックを入れて、「Done」をクリックしてパネルを閉じましょう。
「Is a part of ?」を有効にすると、

  • 親レコードを新規に追加する時に、子レコードも同時に追加できる
  • 親レコードを削除した時に子レコードも同時に削除される

という使い方ができます。

右上の「Save」ボタンをクリックして、保存することを忘れずに。

AppSheet列設定パネルで「Is a part of ?」をチェックする。

これで、「請求書」テーブルと「品目」テーブルとの間に親子関係を設定できました。

請求書アプリにおける「テーブル間の親子関係の設定」手順は以下の通りです。

  1. 「品目」テーブル(子テーブル)に列TYPE「Ref」の列、「請求書ID」列を用意する
  2. 「請求書ID」列の設定パネルで、Type Detailsの「Source table」に「請求書」(親テーブル)を設定する
  3. 「Is a part of ?」をチェックする

請求書アプリで、列TYPE「Ref」から「Is a part of ?」を利用してテーブル間の親子関係を設定する。

AppSheetエディタのプレビューで確認してみましょう。
右側のプレビュー画面で「請求書」を表示し、「+」ボタンで請求書作成フォームを表示します。

一番下までスクロールしてみましょう。
「品目 entries that reference this entry in the 請求書ID column」というフィールドが追加されました。
「Is a part of ?」をチェックして有効にすると、請求書を追加するビューで品目明細を追加できるようになります。

AppSheetアプリに品目を追加できるフィールドが追加された。

「New」をクリックしてみましょう。
「品目」を追加するフォームが表示されると思います。

AppSheetアプリに「品目」テーブルのフォームが表示される。

これで請求書に品目明細を追加できるようになりました。
ただし、「品目 entries that reference this entry in the 請求書ID column」という表示が長いのと、何を言っているのか分からないので、列設定で表示を調整しましょう。

3. AppSheetの分かりにくい表示を整える

AppSheetエディタの左側メニュー「Data」をクリックします。
タブメニュー「Columns」をクリックして、「請求書」をクリックして列設定パネルを開きます。

AppSheetエディタ、Data、Columnsで列設定を行う。

「請求書」テーブルの「列(Columns)」が一覧で表示されます。
一番下までスクロールすると、「Related 品目s」という列が自動的に追加されていることが分かります。

AppSheetでリレーションシップを設定するとVirtual Column(仮想列)が自動的に追加される。

「Related 品目s」の左にあるペン型アイコンが青色なのが分かります。
これは「Related 品目s」列がVirtual Columnであることを示します。
仮想的に追加された列なので、スプレッドシートのデータには影響を及ぼしません。
「請求書」テーブルの一部に、「品目」テーブルの「請求書ID」列が仮想的に含まれたということを意味します。

では、「Related 品目s」列を右にスクロールしていきましょう。
「DISPLAY NAME」フィールドをクリックしてください。

AppSheet列設定パネルでDisplay name を設定する。

Expression Assistant を開いて、以下のように入力して「Save」をクリックして保存します。

AppSheet列設定パネルでExpression Assistant を設定する。

「DISPLAY NAME」に右隣にある「DESCRIPTION」フィールドをクリックして、Expression Assistantから「品目 entries that reference this entry in the 請求書ID column」を消去した後、「Save」をクリックして保存してください。

AppSheet列設定パネルで「Description」を消去する。

再度、AppSheetエディタのプレビューで確認してみましょう。
右側のプレビュー画面で「請求書」を表示し、「+」ボタンで請求書作成フォームを表示します。
「品目 entries that reference this entry in the 請求書ID column」が「品目」に変わって、見た目がスッキリしました。

AppSheetエディタのプレビュー画面で再度確認した。

以上、リレーションシップを使用してテーブル間の親子関係を設定しました。
テーブル間の親子関係は応用が利くので、「Ref」を使ったテクニックをこの機会に習得しておきましょう。

今回(第3回)まではテーブルと列の設定だけで、請求書アプリのイメージが掴めていないかもしれません。
次回(第4回)は少しデータを入力して、品目明細から請求金額をAppSheet関数を使って計算してみます。
SELECT関数を使って他のテーブルの列から値のリストを取得して、SUM関数で合計する方法を解説します。

Share Me!

前の投稿
AppSheetで請求書アプリ(第2回)スプレッドシートからアプリ作成
次の投稿
AppSheetで請求書アプリ(第4回)SELECT関数とSUM関数で合計を計算

関連記事

メニュー