
MIT APP INVENTOR で電子黒板を作る
MIT APP INVENTOR で電子黒板を作りました。
基本コマンドの使い方はこれまでの記事をご覧ください。
新たに使ったコマンドは、描画とアニメーションにある、 キャンバスです。これをScreen1にドラッグします。右側に並んでいるキャンパスのプロパティで、キャンパスのカラーや指で描く線の幅などを設定します。デフォルトですと、白いキャンパスに黒い線なので、黒板の雰囲気を出すために背景は緑、文字を白に設定しました。ボタンを1つドラッグして、リセットボタンも作成しておきます。

次にブロックの編集です。
キャンパスのブロックを下記のように取り出して作成します。
上段が指でなぞった文字を描くコマンドです。x座標とy座標の位置関係を上手く利用しています。
下段はリセットボタンの部分です。

これをビルドしてアンドロイド端末のQRコードで読み込みます。
横にしても使えたので、このように指で文字を描いてみました。タッチの感じもなかなかよいです。


本物の電子黒板の原理を考えるのにも役立ちそうです。
iPadを使えばもっと大きく使えますね。
さらには線の色や太さを変えたり、画像を保存できるようにするなど、いろいろと改良もできそうです。
関連するアプリ開発です。
MIT APP INVENTOR でスクリーンに〇を描くだけのアプリ|門田和雄 (note.com)
noteのマガジンにまとめた記事はこちらです。