MIT App Inventor 2であのアプリを作ってみる (KanooPizza 4）

今回も、メニュー選択画面。

メニューと個数の選択と合計金額算出まで。個数選択はextensionを利用して、ドロップダウンメニュー形式を採用。

アプリ実行のビデオ：

スクリーンのデザイン：

前回と若干重複があるが。。。スクロールの順に画面展開を表示。赤点線部分は、このスクリーンに遷移した時は非表示。

                                                     

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　TableArrangementを初めて利用（赤点線内）

                   > 途中若干省略>   

ブロック・コード：

メニュー選択部分のみ。

1. スクリーンの初期化時に、関数setPopUpを実行して、個数選択のドロップダウン・メニューを生成するextension (UrsAI2Popup)のメニューアイテムをセットする。また、関数setInitialOrderLabelを実行して、各商品名の下に価格を表示する。

（各「個数選択」ボタン毎にドロップダウンメニューに表示するアイテムを設定する。８つボタンがあるのでUrsAI2Popup8まで同じ内容で設定する。）

2. 「個数選択」ボタン毎にタップした時の動作を設定：

最初の「個数選択」ボタンをタップしたら、メニューが表示され、いずれかのアイテムをタップすると、変数piece1 (〜piece8まである）に、品名、単価、個数をリスト形式で格納する（後でこれらデータを利用するために）。同時に、単価のみが表示されていた「ご注文内容」に「単価X個数＝金額」を表示する。変数Titleには、メニューのアイテム（個数）が格納されている。

以下、途中省略。piece8までそれぞれ設定する。

3. 「ご注文のご確認とお支払い」ボタンをタップすると、TableArrangementが設定されているVerticalArrangement6が表示される。TableArrangementは、columnとrowを持つテーブル型レイアウト・コンテナー。

もし、piece1のアイテム数が0超の場合は、1行目に、piece1の各アイテム（品名、単価、個数、金額）を所定のラベルに表示する。もし、piece1のアイテム数が0の場合（個数選択をしていない）は、所定のラベルは非表示とする。

金額は、リスト型変数totalToPayListに順番に格納していく。

piece8までチェックし、表示・非表示毎に処理を行う。途中省略。

最後に関数sumTotalToPayを実行し、合計金額を所定のラベルに表示する。extension(TextUtils)を利用して、金額は3桁毎にコンマを入れる。

関数sumTotalToPay：品目ごとの金額がリスト形式で格納されている変数totalToPayListの各アイテムをfor eachで読み込み合計金額を計算する。計算結果は変数totalToPayに格納。この結果は上記textLabelTotalに表示される。

個数選択を間違えた場合のやり直しができるようにしたいが。。。現在のところできない。まだまだ検討すべき点は多くある。（実現が無理なようなものも含めて）

                                                  *************************************************************

前回までのブログ：

MIT App Inventorであのアプリを作ってみる　(KanooPizza 3）

MIT App Inventorであのアプリを作ってみる　(KanooPizza 2）

MIT App Inventorであのアプリを作ってみる　(KanooPizza 1）