請求書アプリを作りながら、AppSheetの使い方を学びましょう。
前回（第2回）はスプレッドシートからアプリを生成し、テーブルと列の設定を行いました。
今回はリレーションシップを使用してテーブル間の親子関係を設定します。
請求書に限らず、リレーションシップの概念はアプリ開発に必須ですが、AppSheetでもテーブル間のリレーションシップ設定ができるんです！
【お知らせ】
2022年10月以降、AppSheetエディタの画面が新しく変更されています。
AppSheetのアップデートが速すぎて（汗）、このブログ記事はまだ新エディタの画面には対応していません。
エディタ画面右上にある「Switch to the legacy editor」というアイコンをクリックすると、新エディタと旧エディタの切り替えができます。
記事のアップデートができるまでは、とりあえず、旧エディタに切り替えて解説を読んでください。
1. 請求書に明細を追加する
請求書には商品名、単価、数量、金額などの明細が必要です。
第2回で請求書に明細を追加するための設定は済んでいます。
請求書に明細を追加するためには、リレーションシップを利用してテーブル間の親子関係をAppSheetで設定する必要があります。
タスク管理アプリでも「タスク」テーブルと「ノート」テーブル、「ドライブ」テーブルに親子関係を設定しました。
請求書アプリでは、請求書と明細の親子関係は特に重要ですので、詳しく解説していきます。
2. AppSheetでは「Ref」で親子関係を設定する
請求書と明細の関係は、請求書が親、明細が子になります。
請求書アプリでは、「請求書」テーブルが親、「明細」テーブルが子になります。
AppSheet では、列TYPEに「Ref」を設定することでテーブル間のリレーションシップを設定します。
前回（第2回）で、「明細」テーブルに「請求書」という列を用意しました。
この「請求書」列には、「請求書」テーブルの「ID」の値を保存しておき、「明細」テーブルと「請求書」テーブルとのリレーションシップが設定されます。
では、このリレーションシップを利用して、「請求書」テーブルと「明細」テーブルとの間に親子関係を設定しましょう。
AppSheetにおけるテーブル間の親子関係は以下のように設定します。
請求書アプリでは、前回（第2回）で設定は済んでいますが、手順を確認します。
- 子テーブル内に列TYPE「Ref」の列を用意する
- 列設定パネルで、Type Detailsの「Source table」に親テーブルを設定する
- 「Is a part of ?」をチェックする
3の「Is a part of ?」にチェックを入れて有効にすると、
- 親レコードを新規に追加する時に、子レコードも同時に追加できる
- 親レコードを削除した時に子レコードも同時に削除される
という使い方ができます。
請求書を新規で追加する際に、明細行も同時に追加するのが自然な使い方です。
また、親となる請求書を削除した時に、子の明細も削除された方が自然です。
なので、「Is a part of ?」をチェックして有効にしておきましょう。
これで、「請求書」テーブルと「明細」テーブルとの間に親子関係を設定できました。
請求書アプリにおける「テーブル間の親子関係の設定」手順は以下の通りです。
- 「明細」テーブル（子テーブル）に列TYPE「Ref」の列、「請求書」列を用意する
- 「請求書」列の設定パネルで、Type Detailsの「Source table」に「請求書」（親テーブル）を設定する
- 「Is a part of ?」をチェックする
AppSheetエディタのプレビューで確認してみましょう。
右側のプレビュー画面で「請求書」を表示し、「+」ボタンで請求書作成フォームを表示します。
一番下までスクロールしてみましょう。
「明細 entries that reference this entry in the 請求書 column」というフィールドがあり、「New」をクリックして明細を追加できるようになっています。
「Is a part of ?」を有効にしないと、請求書を新規で追加するビューでこのフィールドが表示されません。
「New」をクリックしてみましょう。
「明細」を追加するフォームが表示されると思います。
これで請求書に明細を追加できるようになりました。
ただし、「明細 entries that reference this entry in the 請求書 column」という表示が長いのと、何を言っているのか分からないので、列設定で表示を調整しましょう。
3. AppSheetの分かりにくい表示を整える
AppSheetエディタの左側メニュー「Data」をクリックします。
タブメニュー「Columns」に移動して、「請求書」をクリックして列設定パネルを開きます。
「請求書」テーブルの「列（Columns）」が一覧で表示されます。
一番下までスクロールすると、「Related 明細s」という列が自動的に追加されていることが分かります。
「Related 明細s」の左にあるペン型アイコンが青色なのが分かります。
これは「Related 明細s」列がVirtual Column（仮想列）であることを示します。
仮想的に追加された列なので、スプレッドシートのデータには影響を及ぼしません。
「請求書」テーブルの一部に、「明細」テーブルの「請求書」列が仮想的に含まれたということを意味します。
では、「Related 明細s」列を右にスクロールしていきましょう。
「DISPLAY NAME」フィールドをクリックしてください。
Expression Assistant を開いて、以下のように入力して「Save」をクリックして保存します。
「DISPLAY NAME」に右隣にある「DESCRIPTION」フィールドをクリックして、Expression Assistantから「明細 entries that reference this entry in the 請求書 column」を消去した後、「Save」をクリックして保存してください。
再度、AppSheetエディタのプレビューで確認してみましょう。
右側のプレビュー画面で「請求書」を表示し、「+」ボタンで請求書作成フォームを表示します。
「明細 entries that reference this entry in the 請求書 column」が「明細」に変わって、見た目がスッキリしました。
以上、リレーションシップを使用してテーブル間の親子関係を設定しました。
テーブル間の親子関係は応用が利くので、「Ref」を使ったテクニックをこの機会に習得しておきましょう。
今回（第3回）まではテーブルと列の設定を進めてきました。
次回（第4回）は、実際に明細から請求金額をAppSheet関数を使って計算してみます。
SELECT関数を使って他のテーブルの列から値のリストを取得して、SUM関数で合計する方法を解説します。
