見出し画像

書けそうでで書けない漢字を確認する「難書漢字」アプリを作成しました

スマホやパソコンを使って書くようになって、とにかく書けそうで書けない漢字が増えた。で、下記のApp Inventor アプリを作成してみました。 

考慮したのは
・さっと調べで拡大文字で細かいところを確認できる
・手書きで練習ができる
・せっかく調べた漢字なので、また確認・復習ができるよう漢字の読み/保存ができる


画面の設計

画像2

画面設計

上から順に、
 ・TextBox(漢字を入力・表示する)
 ・Horizontal Arrangement
 ・TextBox(漢字の読みを入力・表示する)
 ・Button(保存):読みと漢字をセットでデータベースに保存する
 ・Button(削除):保存した読みと漢字のセットをデータベースから削除する
 ・Button(読み選択):管理している読みのリストを表示し、選択できるようにする
 ・Button(漢字表示):読みに対応する漢字を表示する
 ・Button(手順消去): 手書き画面を消去する
非表示コンポーネント
 ・Canvas:手書き練習用
 ・TinyDB:読みと漢字のセットを保存する
 ・Notifier:「保存」「削除」の完了を報知する

プログラミング

ブロックの全体は下記の通りです。

ブロック全体

上から順に
 ①変数の定義
 ②起動時の処理
  ・データベースに保存した読みと漢字のセットをリストにセットする
 ③ボタン「保存」のクリック処理
  ・読みと漢字をセットでデータベースに保存する
 ④ボタン「削除」のクリック処理:読みに表示された読みと漢字のセットをデータベースから削除する
 ⑤ボタン「読み選択」のクリック処理
  ・管理している読みと漢字のセットのうち、読みをリストとして表示し選択できるようにする
 ⑥ボタン「漢字表示」のクリック処理
  ・読みに対応した感じを表示する
 ⑦ボタン「手書き表示」のクリック処理
  ・手書き画面を消去する
 ⑧procedure(データベースの内容をリストに表示する)
  ・データベースの読み/漢字を呼び出し、リスト変数にセット
  ・リスト変数をSpinerのelementにセット
 ⑨Spinerのリストから選択された後の処理
  ・選択した読みを表示する
  ・漢字をクリアする
 ⑩Canvasに手書き線を引く