75才からのモバイルアプリ作成

MIT App Inventor 2 を使ったアプリ作成

MIT App Inventor 2で遊ぶ (新ことわざ遊び 2 -R of CRUD-)

2024-11-08 08:20:51 | 日記

今回は、CRUDのR(Read)を中心にステップごとに確認しながら、次の句の表示などを実装。次の句を表示させるのは「再読込」ボタンを使っている。

ことわざデータの更新(U)、削除(D)の実装は次回以降に予定(は未定)。

アプリ実行のビデオ:

テスト、確認のためのデータなどがあり、画面がごちゃごちゃしているが最終的には、これら不要なものは削除予定。

また、ミラリング・ソフト (X-Mirage) が不調のため、とりあえずスマホの画面キャプチャーのみ。次回実装予定の更新、削除の時にはソフトがうまく作動し、連動しているところを見ることができればと思うが。

スピーカーをONにすれば効果音も聞ける。

スクリーン・デザイン:

左より、

1. メイン画面:「タグリスト」および「取得JSONデータ」はFirebase Realtime Databaseより読み込むデータを確認するためのもの。また、ことわざデータの出典を明記し、同サイトへのリンク(>)を追加。(MIT App InventorのDesigner画面では全てを表示できなかったので、実際のアプリのスクリーンショットを使用)

2. 追加画面:「最初の句」「次の句」入力欄の次に「かなのフルテキスト」を追加。他は変更等なし

3. ことわざの出典「ことわざ・慣用句の百科事典」のサイトを表示する画面。

                    .           .         

ブロック・コード:

Screen1(メイン画面)の初期化時に、関数reset(変数のリセット)、関数getTagList(データIDのリスト取得)を実行。

また、正解と不正解の際に使う効果音を設定。

「再読込」ボタンをタップした時の動作設定。スクリーンの初期化と同じく関数reset、関数getTagListを実行。加えて、解答(フルテキスト)と正誤チェックの結果を表示するLabelを空白に。

関数getTagList

前回取り上げた各データのID取得と同じ内容。

前回すでに取り上げ済みだが、今回はtestLabel1(タグリスト)にIDを念のため表示。

そして、ことわざデータ取得のためのGETリクエストを行う関数makeGETequestを実行。

関数makeGETequest

データ全てを取得するので、「?shallow=true」は省く。

Firebase Realtime Databaseよりデータを取得後、デコードの上変数JSONDataに格納。

関数makeFirstPartList(最初の句のリスト作成)、関数makeSecondPartList(次の句のリスト作成)、関数makeFullTestList(最初の句と次の句を結合したフルテキストのリスト作成)、関数getRandomlychosenFirstPart(無作為に選んだ最初の句を選択)を実行し、makeSecondPartListが作成したsecondoPartListをSecondPartListPicker(次の句を選択するリスト)に設定する。

関数makeFirstPartList

空の変数firstPartListを設定。

tagaListのIDをキーにして、firstPart(最初の句)のデータをリスト形式でfirstPartListに格納。

関数getRandomlychosenFirstPart

空の変数chosenFirstPartを設定。

firstPartListをextensionを利用してシャッフルし、最初の句をchosenFirstPartに格納。

関数makeSecondPartList

関数makeFirstPartListと同様にsecondPartListに次の句のリストを格納。

関数makeFullTestList

同上。

最初の句とリストより選択した次の句を、全角の空白を間に入れて結合し変数answerFullTextを設定。(データベースに保存してあるフルテキストは、最初の句と次の句の間に全角の空白を挿入してある。)

fullTextListの中にanswerFullTextが含まれていたら、showResultLabelに「正解」を、そうでなければ「もう一度次の句を選んでください」のメッセージを表示するとともに、効果音を再生する。

ことわざデータの出典表示の右端にある「>」ボタンをタップすると、ことわざデータ出典元のサイトを表示するスクリーンへ遷移する。

 

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

前回までのブログ:

MIT App Inventor 2で遊ぶ (新ことわざ遊び 1 -C of CRUD-)