· 

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

スプレッドシートから請求書アプリを作成する

 

このブログでは、請求書アプリでAppSheetの使い方を学びます。

 

前回(第1回)はアプリの概要について紹介しました。

今回は実際にアプリを生成して、テーブルと列の設定まで進めます。

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

 

それではアプリを作成していきましょう。

AppSheetアプリにはエクセルやGoogleスプレッドシートなどのデータが必要です。

このブログでは、請求書アプリのサンプルデータとしてエクセルのデータを用意しました。

まずは、下のエクセルデータをダウンロードしてください。

 

ダウンロード
請求書アプリのサンプルデータ
請求書.xlsx
Microsoft Excel 11.5 KB

 

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

 

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

 

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

 

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

 

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

 

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

2. アプリを生成する

 

AppSheetにログインして、「Make a new app」をクリックします。

 

AppSheetにログイン後、「Make a new app」をクリックする。

 

「Start with your own data」をクリックします。

 

「Start with your own data」をクリックする。

 

App name(アプリ名)には日本語が入力できないので、とりあえず「Invoice」にします。

Category(カテゴリー)は選択しなくてもよいです。

 

「Create a new app」を設定する。

 

 

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

 

Googleスプレッドシートを選択する。

 

アプリが生成できました。

画面右にプレビューが表示すると下のようになります。

 

AppSheetプレビューにアプリが表示される。

3. テーブルを追加する

 

左側メニューにある「Data」をクリックして、データを確認しましょう。

タブメニュー「Tables」をクリックするとテーブルが表示されます。

テーブルとは、アプリからデータを追加したり、更新したり、削除できるデータの格納庫です。

「請求書」というテーブルをクリックしてみましょう。

 

テーブルを表示する。

 

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

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

 

列を表示する。

 

他に「取引先」「品目マスタ」「品目」というシートがありますね。この3つのテーブルも作成しましょう。

AppSheetのエディタ画面に戻って「Data」→「Tables」でテーブル設定を続けます。

 

「New Table」の右に「Add a table for "取引先"」「Add a table for "品目マスタ"」「Add a table for "品目"」というボタンがあります。このボタンをクリックしましょう。

 

テーブルを追加する。

 

「取引先」「品目マスタ」「品目」のテーブルができました。

テーブルの設定は特に変更する必要はありません。次に進みましょう。

 

テーブルを追加した。

4. 「請求書」テーブルの列を設定する

 

4つのテーブルの列を設定していきます。

タブメニュー「Columns」または、テーブルパネルの「View Columns」をクリックしましょう。

各テーブルの「列(Columns)」が一覧で表示されます。

 

列を設定する。

 

 

列には、アプリから追加した各項目のデータの値(文字、数字、日付、時間など)が保存されます。

アプリから追加したデータは、スプレッドシートでは1行ずつ記録されていきます。

この1行のデータを「レコード」と呼びます。

 

スプレッドシートのレコードを識別する。

 

それでは、「請求書」テーブルの列を設定していきましょう。

下の表のように、各列のフィールドを設定してください。

 

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

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

 

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

 

ID

 

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

 

取引先ID

 

「取引先ID」列は、「取引先」テーブルの「ID」列の値を保存します。

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

 

「取引先ID」列はTYPEを「Ref」にしています。

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

 

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

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

 

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

 

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

 

「Source table」を「取引先」に設定する。

発行日

 

「発行日」列の設定をします。

請求書を作成する時に、初期値として今日の日付を表示させます。

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

 

「発行日」を編集する。

 

Auto Compute → Initaial Value(初期値)を設定します。

 

三角フラスコアイコンをクリックします。

 

Initial Valueを設定する

 

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

TODAY関数は今日の日付を入力する関数です。

 

TODAY関数を設定する。
TODAY()
今日の日付を入力する。

件名

 

 「件名」は初期値で「請求書」を表示したいと思います。

列設定パネルから直接設定してみましょう。

「件名」列の「INITIAL VALUE」のフィールドをクリックします。

 

DISPLAY NAMEを設定する。

 

Expression Assistant が表示されます。

以下のように入力して「Save」をクリックします。

 

Expression Assistant を設定する。

 

設定後は「INITIAL VALUE」フィールドに「請求書」と表示されます。

 

DISPLAY NAME の設定が完成した。

最終更新日時

 

「最終更新日時」列は、請求書の内容を更新するたびに日時を保存しておきます。

列設定パネルから直接設定してみましょう。

「最終更新日時」列の「FORMULA」のフィールドをクリックします。

 

「最終更新日時」を設定する。

 

Expression Assistant から下のように「NOW()」と入力して「Save」をクリックします。

上の画面のように「FORMULA」のフィールドに「NOW()」と表示されます。

NOW関数は現在日時を入力する関数です。

 

FORMULAを設定する。
NOW()
現在日時を入力する(例:2021/08/01 15:00:00)。

請求書番号

 

「請求書番号」列は、重複がない一意の値を設定したいと思います。

一般的に、請求書番号は「日付-通し番号」のような感じだと思います。

通し番号の設定は少し手間がかかるので、ここでは現在日時を代用しましょう。

 

「最終更新日時」列と同じように、列設定パネルから直接設定します。

「請求書番号」列の「INITIAL VALUE」フィールドをクリックしてください。

 

「INITIAL VALUE」を設定する。

 

 

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

 

「Expression Assistant」に関数を入力する。

 

「今日の日付」と「今日の時刻」を「-」つなげて「請求書番号」を作成したいので、CONCATENATE関数を使いましょう。

()の中に、つなげたい文字列や [ 列名 ] をカンマ(, )で区切って列挙するだけで1つの文字列にできます。

 

CONCATENATE関数 CONCATENATE(”文字列1”, ”文字列2”, ”文字列3”, ・・・)=> 文字列1,2,3,...を連結する。

TEXT関数は、日時の値を任意のフォーマットに変換することができます。

ここでは、今日の日付(TODAY())の値を「yyyymmdd」に、現在の時刻(TIMENOW())の値を「HHMM」に変換します。

 

例えば、「2021年8月15日の17時25分」なら「20210815-1725」という請求書番号が生成されます。

 

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

トリガ

 

「トリガ」列は、第7回で請求書のPDFを発行する際に使用する列です。 

詳細は第7回で解説するので、現時点では意味が分からなくても大丈夫です。

「トリガ」列の「INITIAL VALUE」フィールドをクリックして、Expression Assistantから「0」を入力して「Save」してください。

 

5. 「取引先」テーブルの列を設定する

 

続けて、「取引先」テーブルの列を設定してきましょう。

タブメニュー「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 check
住所 Address     check check check
電話番号 Phone     check check  
メールアドレス Email     check check  

 

以上の列に加えて、「Related 請求書s」という Virtual Column(仮想列)が一番下にあるかもしれません。

これは、さきほどの「請求書」テーブル「取引先ID」列で、「Ref」でリレーションシップを設定したことにより、AppSheet が自動的に作成した仮想列です。

 

Virtual Column(仮想列)が自動的に追加される。

 

「Related 請求書s」の列を右にスクロールしてみましょう。

「DESCRIPTION」のフィールドに「請求書 entries that reference this entry in the 取引先ID column」というのがあります。

「取引先」のViewを表示したときに、この長い文字列が表示されてしまうので、これを消去しましょう。

その左隣にある「DISPLAY NAME」のフィールドに「請求書」しておきます。

 

DESCRIPTION を消去し、DISPLAY NAME を入力する。

6. 「品目マスタ」テーブルの列を設定する

 

次に、「品目マスタ」テーブルの列を設定してきましょう。

タブメニュー「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」または「Buttons」

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

 

税区分の「Enum」を設定する。

 

「税区分」はたいてい「10%」なので、初期値(INITIAL VALUE)を「10%」にしておきます。

説設定パネルで、「税区分」の「INITIAL VALUE」フィールドをクリックして、Expression Assistant から10%を入力してください。

 

Initial Valueを設定する。

単価

 

「単価」列を設定します。

「単価」列には税込金額を入力させたいので、列設定パネルから「DISPLAY NAME」に「単価(税込)」と入力しておきました。

 

DISPLAY NAME を設定する。

 

また、「単価」列はお金の計算を扱うので列TYPEを「Price」にしています。

AppSheet では「Price」列の初期設定が米ドルの設定になっているため、日本円に設定し直す必要があります。

 

まず「単価」列の左にある編集アイコンをクリックして「単価」列 を設定しましょう。

 

「単価」列を設定する。

 

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

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

「Decimal digits」は初期設定では「2」になっていますが、日本円で小数桁は扱わないので「0」にしましょう。

「$」を「¥」に変更することを忘れずに。

 

Price を日本円の設定にする。

7. 「品目」テーブルの列を設定する

 

最後に、「品目」テーブルの列を設定してきましょう。

タブメニュー「Columns」→ 「品目」をクリックして、列設定パネルを開きます。

下の表のように、各列のフィールドを設定してください。

 

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

NAME TYPE KEY LABEL SHOW? EDITABLE? REQUIRE?
 _RowNumber Number          
ID Text  check     check check
請求書ID Ref     check check check
品目マスタID Ref    check check check check
単価 Price     check check  check
単位 Text     check check check
数量 Number     check check check
金額 Price     check check  
税区分 Enum     check check check
消費税率 Decimal     check check  
消費税額 Price     check check  
税込金額 Price     check check  
作成日時 DateTime     check check  

 

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

 

請求書ID、品目マスタID

 

「請求書ID」列には「請求書」テーブルの「ID」列の値を保存します。

「請求書ID」列はTYPEを「Ref」にしています。

編集アイコンをクリックして設定パネルを開き、Type Details の「Source table」を「請求書」に設定してください。

 

Type「Ref」を設定することにより、テーブル間のリレーションシップを設定する。

 

「品目マスタID」列には「品目マスタ」テーブルの「ID」列の値を保存します。

「品目マスタID」列はTYPEを「Ref」にしています。

編集アイコンをクリックして設定パネルを開き、Type Details の「Source table」を「品目マスタ」に設定してください。

 

Type「Ref」を設定することにより、テーブル間のリレーションシップを設定する。

 

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

ついでに、列設定パネルで「品目マスタID」列の「DISPLAY NAME」を「品目」にしておきましょう。

 

Display name を設定する。

 

「品目」テーブルの列TYPE「Ref」については以上です。

 

実は、現在の状態だと請求書に品目明細を追加することができません。

「請求書」テーブルと「品目」テーブルのリレーションシップを親子関係に設定すればできるようになるのですが、説明が長くなるため、詳しくは第3回で解説することにします。

 

単価、単位、税区分

 

「品目マスタ」テーブルにも「単価」「単位」「税区分」という列がありました。

「品目」テーブルでは、「品目マスタ」に保存されている「単価」「単位」「税区分」を活用します。

 

品目明細を追加する際に、品目をリストから選択します。

その時にリレーションシップを活用して「単価」「単位」「税区分」を自動的に表示するようにします。

 

まずは「単価」列の設定をしてみましょう。

編集アイコンをクリックして「単価」列の設定パネルを開き、Auto Compute → Initaial Value(初期値)を設定します。

三角フラスコアイコンをクリックします。

 

Auto Compute、Initial Value を設定する。

 

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

選択した「品目マスタID」を「ID」に持つ品目の「単価」を取得して表示しなさい、という意味です。

このように設定すれば、「品目」をリストから選択した時に、その品目の「単価」が自動的に表示されます。

 

Expression Assistant を設定する。

 

「単位」「税区分」も同じように設定します。

列設定パネルの「INITIAL VALUE」フィールドをクリックして、Expression Assistant から入力します。

  • 「単位」:[品目マスタ].[単位]
  • 「税区分」:[品目マスタ].[税区分]

ついでに、「単価」列の「DISPLAY NAME」を「単価(税込)」にしておきましょう。

 

リレーションシップを利用して、INITIAL VALUE を設定する。

金額、消費税額、税込金額

 

「金額」「消費税額」「税込金額」列には計算式を設定します。

列設定パネルの「FORMULA」フィールドをクリックして、以下のように入力してください。

  • 「金額」:[単価]*[数量]-[消費税額]
  • 「消費税額」:FLOOR([単価]*[数量] - [単価]*[数量]/(1+[消費税率]))
  • 「税込金額」:[単価]*[数量]

 

FORMULA に計算式を設定する。

 

「消費税額」列には、FLOOR関数を使用しています。

FLOOR関数は、()内の数値について小数点以下を切り捨てて整数にします。

FLOOR()
FLOOR(数値)  => ()内の数値の小数点以下を切り捨て、整数を返す。

 「消費税額」列では、「単価」「数量」「消費税率」から消費税額を計算します。

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

 

消費税額を計算後、FLOOR関数で小数点以下を切り捨て、整数を返す。

税区分

 

「税区分」列は「品目マスタ」テーブルと同じように設定します。

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

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

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

 

消費税率

 

「消費税率」列は、「税区分」の値によって「0.1」「0.08」「0」いずれかの値を保存するようにします。

条件によって値を変える関数として、IFS関数を使用します。

 

では、列設定パネルで「消費税率」列の「FORMULA」フィールドをクリックしてください。

 

「消費税率」のFORMULAを設定する。

 

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

 

 

Expressionの意味は、

  • 「税区分」列が「10%」の時(条件式1)に「0.1」を入力する(処理1)
  • 「税区分」列が「軽減8%」の時(条件式2)に「0.08」を入力する(処理2)
  • 「税区分」列が「対象外」の時(条件式3)に「0」を入力する(処理3)

という意味です。

 

「税区分」列の値は3つあります。それぞれの値により入力する数値を変えています。

このように複数条件で処理を分岐するために、IFS関数を使用しています。 

 

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

 IFS関数は、()内の条件式が正しいときに、処理を実行します。

条件式1から順に、式が正しいか正しくないか(真か偽か)を判定します。

条件式1が正しい(真)なら、処理1を実行します。正しくない(偽)なら、処理1を飛ばして条件式2の判定に移ります。

 

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

 

Price、DateTime

 

「単価」「金額」「消費税額」「税込金額」列は、列TYPEを「Price」にしています。

「品目マスタ」テーブルの「単価」列で設定したように、日本円に設定し直す必要があります。

 

それぞれ列の左にある編集アイコンをクリックして設定パネルを開きましょう。

Type Details を以下のように設定してください。

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

最後に「作成日時」列は、列TYPEが「DateTime」です。

 列設定パネル、「作成日時」列の「FORMULA」フィールドをクリックして、Expression Assistant から「NOW()」を入力しましょう。

 

列TYPE「DateTime」のFORMULA に「NOW()」を設定する。

 

以上、請求書アプリを生成してみました。

請求書作成のためには、もう少し細かい設定が必要になります。

今回(第2回)は説明が長くなってしまったので、細かい設定については次回以降で解説します。

 

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

 

アプリを作る前に実際に試してみたい方は、アプリスイートが作ったサンプルアプリを7日間無料体験ができます。

こちらからお問い合わせください。