AppSheetで請求書アプリ(第2回)スプレッドシートからアプリ作成

folder_openAppSheet

請求書アプリを作りながら、AppSheetの使い方を学びましょう。
前回(第1回)は請求書アプリの概要について紹介しました。
今回は、実際にアプリを作成してみましょう。
スプレッドシートをGoogleドライブにアップロードして、テーブルと列の設定まで進めます。

【お知らせ】
2022年10月以降、AppSheetエディタの画面が新しく変更されています。
AppSheetのアップデートが速すぎて(汗)、このブログ記事はまだ新エディタの画面には対応していません。
エディタ画面右上にある「Switch to the legacy editor」というアイコンをクリックすると、新エディタと旧エディタの切り替えができます。
記事のアップデートができるまでは、とりあえず、旧エディタに切り替えて解説を読んでください。

Switch to the legacy editor」で旧エディタに切り替える。

1. スプレッドシートを作成する

それではアプリを作成していきましょう。
AppSheetアプリにはエクセルやGoogleスプレッドシートなどのデータが必要です。
このブログでは、請求書アプリのサンプルデータとしてエクセルのデータを用意しました。
まずは、下のエクセルのアイコンをクリックして、データをダウンロードしてください。

Googleアカウントにログインして、Googleドライブにエクセルのデータをアップロードしましょう。

GoogleドライブにエクセルのAppSheetデータをアップロードする。

Googleドライブ上でエクセルデータを開いた後、Googleスプレッドシートに変換して保存しておきます。

エクセルデータをGoogleスプレッドシートに変換する。

Googleスプレッドシートに変換して保存しました。

Googleスプレッドシートに変換して保存した。

2. AppSheetアプリを生成する

AppSheetにログインして、「Create」をクリックします。

AppSheetエディタを開いて、Createをクリックする。

「App」の「Start with existing data」をクリックします。

Start with existing dataをクリックして、AppSheetアプリを生成する。

App name(アプリ名)を「請求書」にします。
Category(カテゴリー)は選択しなくてもよいです。
「Choose your data」をクリックします。

AppSheetアプリ名を「請求書」にする。

Select data sourceでアプリで使用するデータを選択します。
さきほど保存したGoogleスプレッドシートを選択したいので、「Google Sheets」をクリックします

Select data sourceでGoogle Sheetsを選択する。

Select a file(ファイルを選択)でさきほど保存したGoogleスプレッドシート(請求書)を選択して「select」をクリックします。

Googleスプレッドシートを選択してAppSheetアプリを生成する。

アプリが生成できました。
画面右のプレビューを表示すると下のようになります。

AppSheetアプリが生成された。

3. 請求書アプリで使用するテーブルを追加する

AppSheetエディタの左側メニューにある「Data」をクリックして、データを確認しましょう。
タブメニュー「Tables」に移動するとテーブルが表示されます。
テーブルとは、アプリからデータを追加したり、更新したり、削除できるデータの格納庫です。
「請求書」というテーブルをクリックしてみましょう。

AppSheetエディタ左側メニュー「Data」をクリック、「Tables」タブに移動して、テーブルをクリックする。

「View Source」をクリックするとアプリに取り込んだスプレッドシートが表示されます。

View sourceでデータソースを開く。

「請求書」というワークシートがあり、テーブル名になっています。

AppSheetはデータソースとしてGoogleスプレッドシートを使える。

ここで、請求書アプリで使用するテーブルを追加しましょう。
他に「取引先」「商品」「明細」というシートがありますね。この3つのテーブルを追加します。

AppSheetエディタ画面に戻ります。
左側メニュー「Data」をクリック、「Tables」タブに移動します。
「New Table」の右に「Add table "取引先"」「Add table "商品"」「Add table"明細"」というボタンがあります。このボタンをクリックしましょう。データソースのシート名を読み取って、テーブルの候補を表示する。

「取引先」「商品」「明細」のテーブルができました。
テーブルの設定は特に変更する必要はありません。次に進みましょう。

テーブルを追加した。

4. AppSheetで請求書を作成する

4つのテーブルの列を設定していきます。
はじめに、「請求書」テーブルの列を設定しましょう。
このテーブルがAppSheetで作成する請求書の部分になります。

AppSheetエディタの左側メニュー「Data」をクリックして「Columns」タブに移動するか、「請求書」テーブルの「View Columns」をクリックしましょう。
各テーブルの「列(Columns)」が一覧で表示されます。

Column(列)を設定する。

列には、アプリから追加した各項目のデータの値(文字、数字、日付、時間など)が保存されます。
アプリから追加したデータは、スプレッドシートでは1行ずつ記録されていきます。
この1行のデータを「レコード」と呼びます。

列の値は、データソースのGoogleスプレッドシートにひとつのレコードとして記録されている。

それでは、「請求書」テーブルの列を設定していきましょう。
下の表のように、各列のフィールドを設定してください。

「請求書」テーブルの列設定

NAME TYPE KEY LABEL SHOW? EDITABLE? REQUIRE?
_RowNumber Number
ID Text check check check
取引先 Ref check check check
請求日 Date check check check
支払期日 Date check check check
請求書番号 Text check check check check
件名 Text check check check
備考 Long Text check check
請求書ファイル File check check
トリガ Number check check

 

「請求書」テーブルの各列について設定します。

ID

「ID」列については電子名刺アプリで詳しい説明をしていますので、こちらを参照してください。

取引先

「取引先」列は、「取引先」テーブルの「ID」列の値を保存します。
請求書に取引先を関連付けるリレーションシップが設定され、取引先の名前、担当者、住所、連絡先などが請求書に差し込みされます。

「取引先」列はTYPEを「Ref」にしています。
「Ref」は、別テーブルの列の値を参照したり、テーブル間のリレーションシップを設定する列タイプです。

Ref
  • 別テーブルの値を参照して、リスト表示などに使用する
  • テーブル間のリレーションシップを設定する

「取引先」の左にあるペン型の編集アイコンをクリックすると、「取引先」列の設定パネルが表示されます。

「取引先」列を編集する。

Type Details に「Source table」があります。「取引先」を選択して、右上の「Done」をクリックします。

「Ref」型の列(Column)を設定する。

請求日

「請求日」列の設定をします。
請求書を作成する時に、初期値として今日の日付を表示させます。
「請求日」列 の左にあるペン型の編集アイコンをクリックすると、「請求日」列の設定パネルが表示されます。

「請求書」列を編集する。

「Auto Compute」を開いて、「Initaial Value」(初期値)を設定します。
三角フラスコアイコンをクリックします。

Initial Valueを設定する

Expression Assistant が表示されます。以下のように入力して「Save」をクリックします。
TODAY()というAppSheet関数は今日の日付を入力する関数です。

AppSheet列設定パネル、Expression AssistantでTODAY関数を設定する。

TODAY()

今日の日付を入力する。

請求書番号

「請求書番号」列は、重複がない一意の値として「日付-通し番号」を設定します。

列設定パネルから直接設定してみましょう。
「請求書番号」列の「INITIAL VALUE」フィールドをクリックしてください。

請求書番号のInitial value(初期値)を設定する。

Expression Assistant に以下のように入力します。

請求書番号は、日付(8桁)と通し番号の組み合わせをExpressionで式にする。

以下の式をコピペして使ってください。

 
TEXT( TODAY(), "yyyymmdd") &
"-" &
RIGHT(
 "0" &
 (
  COUNT(
   FILTER(
    "請求書",
    AND(
     [請求日] = [_THISROW].[請求日],
     [_RowNumber] <> [_THISROW].[_RowNumber]
    )
   )
  ) + 1
 ), 2
)

はじめに「今日の日付」を8桁の文字列に変換します。

今日の日付から8桁の文字列を作成する

TEXT( TODAY(), "yyyymmdd" )

TEXTというAppSheet関数を使うと、日時の値を任意のフォーマットに変換することができます。
ここでは、今日の日付(TODAY())の値を「yyyymmdd」形式に変換します。
例えば、「2022年11月1日」なら「20221101」という文字列が生成されます。

TEXT関数TEXT( "日時", "フォーマット")=> 日時を指定したフォーマットに変換する。

続いて、通し番号を作成してみましょう。手順としては、

  1. 同じ請求日のレコードをフィルタリング(検索)する
  2. フィルタリングしたレコード数に「+1」する
  3. 2桁のゼロ埋め文字列を作成する

となります。順にやってみましょう。
「請求書」テーブル内で、同じ請求日のレコードをフィルタリングするために、FILTERというAppSheet関数を使ってみます。

同じ請求日のレコードをフィルタリングする

FILTER(
 "請求書",
 AND(
  [請求日] = [_THISROW].[請求日],
  [_RowNumber] <> [_THISROW].[_RowNumber]
 )
)

FILTER関数は条件に合致するレコードのKEY値(ここでは、「請求書」テーブルの「ID」の値)をリストで取得できる関数です。
第1引数にテーブル名を設定し、第2引数に条件式を設定します。

FILTER関数
FILTER( "テーブル名", 条件式 ) => 条件に合致するレコードのKEY値をリストで返す

ここでは条件式を以下のように設定しました。

  • これから追加する請求書の「請求日」と同じ「請求日」である
  • これから追加する請求書はフィルタリングから除外する

「これから追加する」という部分は、[_THISROW](この行の)で指定しています。
「これから追加する請求書はフィルタリングから除外する」という条件は、「これから追加する(_THISROW)請求書の[_RowNumber](行番号)とは異なる[_RowNumber](行番号)を持つ」という式で設定しています。

次に、FILTER関数でフィルタリングした請求書レコードの数をCOUNTというAppSheet関数で数えます。

フィルタリングした請求書レコードを数えて「+1」する

COUNT(
 FILTER(
  "請求書",
  AND(
   [請求日] = [_THISROW].[請求日],
   [_RowNumber] <> [_THISROW].[_RowNumber]
  )
 )
) + 1

COUNT関数は、リストの数を数える関数です。
FILTER関数の結果はKEY値(請求書「ID」)のリストなので、さきほどのFILTER式をCOUNTの引数にすれば、条件に合致した請求書レコードの数を数えられます。

COUNT関数
COUNT( リスト ) => リストの数を数値で返す

最後に「+1」しているのは、同じ「請求日」のレコードが存在しない(その日付の最初の請求書)の場合、COUNT関数の結果が「0」になるため、「+1」することで通し番号を「01」から始めるためです。

最後に、RIGHTというAppSheet関数を使って、2桁のゼロ埋め文字列を作成します。

2桁のゼロ埋め文字列を作成する

RIGHT(
 "0" &
 (
  COUNT(
   FILTER(
    "請求書",
    AND(
     [請求日] = [_THISROW].[請求日],
     [_RowNumber] <> [_THISROW].[_RowNumber]
    )
   )
  ) + 1
 ), 2
)

RIGHT関数は、右から指定した数だけ文字を抜き出す関数です。

RIGHT関数
RIGHT( 文字列, 抜き出す文字数 ) => 右から指定した数だけ文字を抜き出す

上の例を簡略化して書くと、

RIGHT(
 "0" & 
 (
  同じ請求日の請求書レコード数+1
 )
 , 2
)

となります。
はじめに、「0」と「同じ請求日の請求書レコード数+1」を「&」でつなげて文字列にしています。
「同じ請求日の請求書レコード数+1」を()で括っている点にも注意してください。
例えば、

  • 「同じ請求日の請求書レコード数+1」が1の時:01
  • 「同じ請求日の請求書レコード数+1」が10の時:010

になります。

「同じ請求日の請求書レコード数+1」が2桁の時は「010」のようになりますが、RIGHT関数で右から2つだけ文字を抜き出せば「10」になります。
「同じ請求日の請求書レコード数+1」が1桁なら、RIGHT関数で2文字を抜き出しても同じ値になります。

以上で、通し番号が作成できました。
あとは、最初に作った「請求日」の8桁文字列と通し番号を「-」でつなげるだけです。

TEXT( TODAY(), "yyyymmdd") &
"-" &
RIGHT(
 "0" &
 (
  COUNT(
   FILTER(
    "請求書",
    AND(
     [請求日] = [_THISROW].[請求日],
     [_RowNumber] <> [_THISROW].[_RowNumber]
    )
   )
  ) + 1
 ), 2
)

以上で請求書番号ができました。

件名

「件名」は初期値で「請求書」を表示したいと思います。
列設定パネルから直接設定してみましょう。
「件名」列の「INITIAL VALUE」のフィールドをクリックします。

件名のInitial Value(初期値)を設定する。

Expression Assistant が表示されます。
以下のように入力して「Save」をクリックします。

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

トリガ

「トリガ」列は、第7回で請求書のPDFを発行する際に使用する列です。
詳細は第7回で解説するので、現時点では意味が分からなくても大丈夫です。
「トリガ」列の「INITIAL VALUE」フィールドをクリックして、Expression Assistantから「0」を入力して「Save」してください。

トリガのInitial Valueを設定する。

「請求書」テーブルの列設定は以上です。
設定ができたら、画面右上の「SAVE」をクリックして保存してください。

AppSheetには自動的に保存する機能がありません。
設定を変更したら必ず「SAVE」で保存することを忘れずに。

「SAVE」ボタンをクリックして保存する。

5. 請求する取引先を登録する

続けて、「取引先」テーブルの列を設定してきましょう。
このテーブルに請求する取引先を登録していきます。

AppSheetエディタの左側メニュー「Data」をクリック、「Columns」タブに移動して「取引先」をクリックして列設定パネルを開きます。
下の表のように、各列のフィールドを設定してください。

「取引先」テーブルの列設定

NAME TYPE KEY LABEL SHOW? EDITABLE? REQUIRE?
_RowNumber Number
ID Text Check check check
取引先名 Text Check check check check
部署 Text check check
担当者 Text check check check
郵便番号 Text check check
住所 Address check check
電話番号 Phone check check
メールアドレス Email check check

以上の列に加えて、「Related 請求書s」という Virtual Column(仮想列)が一番下にあるかもしれません。
これは、さきほどの「請求書」テーブル「取引先」列で、「Ref」でリレーションシップを設定したことにより、AppSheetが自動的に作成した仮想列です。

AppSheetではテーブル間のリレーションにより、Virtual Column(仮想列)が自動的に追加される。

「Related 請求書s」の列を右にスクロールしてみましょう。
「DESCRIPTION」のフィールドに「請求書 entries that reference this entry in the 取引先 column」というのがあります。
「取引先」のViewを表示したときに、この長い文字列が表示されてしまうので、これを消去します。
その左隣にある「DISPLAY NAME」のフィールドをクリックして、Expression Assistant から「請求書」を入力しましょう。

AppSheet列設定パネル、DESCRIPTION を消去し、DISPLAY NAME を入力する。

 

6. 商品マスタを登録する

次に、「商品」テーブルの列を設定してきましょう。
このテーブルに商品のマスタデータを登録してきます。

AppSheetエディタの左側メニュー「Data」をクリック、「Columns」にタブ移動して 「商品」をクリックして列設定パネルを開きます。
下の表のように、各列のフィールドを設定してください。

「商品」テーブルの列設定

NAME TYPE KEY LABEL SHOW? EDITABLE? REQUIRE?
_RowNumber Number
ID Text Check Check Check
商品名 Text Check Check Check Check
単価 Price Check Check Check
単位 Text Check Check Check
税区分 Enum Check Check Check

 

「商品」テーブルの各列について設定していきます。

税区分

「税区分」列は「10%」や「軽減8%」など、決められた値から選択するようにします。
その場合は、列TYPEを「Enum」にします。

「税区分」列の編集アイコンをクリックして、設定パネルを開きましょう。
Type Details を以下のように設定します。

  • Values:「Add」で「10%」「軽減8%」「非課税」「対象外」を追加。「%(パーセント)」は全角文字にする。
  • Allow other values:チェックを外す
  • Auto-complete other values:チェックする
  • Base type:「Text」
  • Input mode:「Auto」または「Dropdown」

Valuesの値について、「%(パーセント)」を全角文字にすることに注意してください。

税区分は「Enum」型にして、Valueに税区分を追加する。

「税区分」はたいてい「10%」なので、初期値(INITIAL VALUE)を「10%」にしておきます。
列設定パネルで、「税区分」の「INITIAL VALUE」フィールドをクリックして、Expression Assistant から10%(%は全角文字)を入力してください。

AppSheet列設定パネルでInitial Valueを設定する。

単価

「単価」列はお金の計算を扱うので列TYPEを「Price」にしています。
AppSheetでは「Price」列の初期設定が米ドルの設定になっているため、日本円に設定し直す必要があります。「単価」列の左にある編集アイコンをクリックして「単価」列 を設定しましょう。

「単価」列を編集する。

Type Details を以下のように設定します。

  • Decimal digits(小数桁) :「0」
  • Currency symbol:「¥」

「Decimal digits」は初期設定では「2」になっていますが、日本円で小数桁は扱わないので「0」にしましょう。
「$」を「¥」に変更することを忘れずに。

「Price」型列の設定をする。

7. AppSheetから請求書明細を追加する

最後に、「明細」テーブルの列を設定してきましょう。
AppSheetで請求書に明細行を追加すると、このテーブルに明細が作成されます。

AppSheetエディタの左側メニュー「Data」をクリック、「Columns」タブに移動して「明細」をクリックして列設定パネルを開きます。
下の表のように、各列のフィールドを設定してください。

「明細」テーブルの列設定

NAME TYPE KEY LABEL SHOW? EDITABLE? REQUIRE?
_RowNumber Number
ID Text check check check
請求書 Ref check check check
商品 Ref check check check check
単価 Price check check check
単位 Text check check check
数量 Number check check check
金額 Price check check
税区分 Enum check check check
消費税額 Price check check
合計 Price check check

 

「明細」テーブルの各列について設定していきます。

請求書、商品

「請求書」列には「請求書」テーブルの「ID」列の値を保存します。
「請求書」列はTYPEを「Ref」にしています。
編集アイコンをクリックして設定パネルを開き、Type Details の「Source table」を「請求書」に設定してください。
「Is a part of?」もチェックして有効にしておきます。

「請求書」列の「Ref」型について設定する。「Is a part of?」のチェックを忘れずにする。

「商品」列には「商品」テーブルの「ID」列の値を保存します。
「商品」列はTYPEを「Ref」にしています。
編集アイコンをクリックして設定パネルを開き、Type Details の「Source table」を「商品」に設定してください。

「商品」列の「Ref」型を設定する。

これで、請求書と明細、明細と商品を関連付けるリレーションシップが設定できました。

単価、単位、税区分

「商品」テーブルにも「単価」「単位」「税区分」という列がありました。
「明細」テーブルでは、「商品」に保存されている「単価」「単位」「税区分」を活用します。

請求書明細を追加する際に、商品をリストから選択します。
その時にリレーションシップを活用して「単価」「単位」「税区分」を自動的に初期値として入力します。

まずは「単価」列の設定をしてみましょう。
編集アイコンをクリックして「単価」列の設定パネルを開き、「Auto Compute」を開いて「Initaial Value」(初期値)を設定します。
三角フラスコアイコンをクリックします。

AppSheet列設定パネルでAuto Compute、Initial Value を設定する。

Expression Assistant が表示されます。以下のように入力して「Save」をクリックします。
選択した「商品」の「単価」を取得して表示しなさい、という意味です。
このように設定すれば、「商品」をリストから選択した時に、その商品の「単価」が自動的に表示されます。

商品テーブルのRef(リレーションシップ)を活用して、単価を自動的に入力する。

「単位」「税区分」も同じように設定します。
列設定パネルの「INITIAL VALUE」フィールドをクリックして、Expression Assistant から入力します。

  • 「単位」:[商品].[単位]
  • 「税区分」:[商品].[税区分]

商品テーブルのRef(リレーションシップ)を活用して、単位、税区分を自動的に入力する。

金額、消費税額、合計

「金額」「消費税額」「合計」列には計算式を設定します。
列設定パネルの「FORMULA」フィールドをクリックして、それぞれ入力していきます。

金額、税区分、消費税額の計算式をFormulaに入力する。

以下の式をコピペして使ってください。

金額の「FORMULA」

[単価] * [数量]

消費税額の「FORMULA」

[単価] * [数量] * IFS(
 [税区分] = "10%", 0.1,
 [税区分] = "軽減8%", 0.08,
 [税区分] = "対象外", 0,
 [税区分] = "非課税", 0,
)

合計の「FORMULA」

[金額] + [消費税額]

消費税額の式では、IFSというAppSheet関数を使っています。
「税区分」の値によって「0.1」「0.08」「0」いずれかの値を消費税率にするようにしています。
このように複数条件で処理を分岐する際に、IFS関数を使用します。

IFS()

IFS(
条件式1, 処理1,
条件式2, 処理2,
条件式3, 処理3,
...)

IFS関数は、()内の条件式が正しいときに、処理を実行します。
条件式1から順に、式が正しいか正しくないか(真か偽か)を判定します。
条件式1が正しい(真)なら、処理1を実行します。正しくない(偽)なら、処理1を飛ばして条件式2の判定に移ります。

式が正しくて処理が実行されたら、そこで処理はストップします。

税区分

「税区分」列は「商品」テーブルと同じように設定します。
「税区分」列の編集アイコンをクリックして設定パネルを開き、Type Details を以下のように設定します。

  • Values:「Add」で「10%」「軽減8%」「非課税」「対象外」を追加。「%(パーセント)」は全角文字にする。
  • Allow other values:チェックを外す
  • Auto-complete other values:チェックする
  • Base type:「Text」
  • Input mode:「Auto」または「Dropdown」

Valuesの値について、「%(パーセント)」を全角文字にすることを忘れずに。

単価、金額、消費税額、合計

「単価」「金額」「消費税額」「合計」列は、列TYPEを「Price」にしています。
「商品」テーブルので設定したように、日本円に設定し直す必要があります。

それぞれ列の左にある編集アイコンをクリックして設定パネルを開きましょう。
Type Details を以下のように設定してください。

  • Decimal digits(小数桁) :「0」
  • Currency symbol:「¥」

以上、請求書アプリを生成してみました。
請求書作成のためには、もう少し細かい設定が必要になります。
今回(第2回)は説明が長くなってしまったので、細かい設定については次回以降で解説します。

次回(第3回)は、列TYPE「Ref」で設定したリレーションシップを使用して、「請求書」テーブルと「品目」テーブルの親子関係を設定します。

Share Me!

前の投稿
AppSheetで請求書アプリ(第1回)Automationで請求書を発行しよう
次の投稿
AppSheetで請求書アプリ(第3回)リレーションシップで親子関係を設定

関連記事

メニュー