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

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

MIT App Inventorで遊ぶ (失敗作1)

2024-04-01 18:34:26 | 日記

サクッとこんなアプリもできますよ!と言いたいが、手間暇がかかった割に、なぜこんなの作ったの?と思わず言ってしまうアプリを一つ。

MIT App Inventorが用意してくれているcomponent(ブロック)に、BarcodeScannerというものがある。これは、QR codeを読みとり、その内容を返してくれる。今回は、これとTextToSpeech componentを使って作ってみたい。

QR codeを作ってくれたのは、QR Code Generator (https://www.the-qrcode-generator.com/) とても軽快で使いやすかった。

まず、お店屋さんごっこカード(品物とQRコード)なるものを作成。そして、アプリでQR Codeを読み取れば、音声で、これが何か、産地はどこか、値段はいくらかを教えてくれるというもの。ブロックもシンプル、すべてシンプル、シンプルそのもの!!(でも、QR codeの付いたカードを作るのは手間がかかった。何回も失敗した)

お店屋さんごっこカード:

(このQR codeをスキャナーアプリで読み取れる!)

                                             

実行画面:

(スキャンする時は画面がlandscapeになってしまう?どうすればいいのだろうか?)

スクリーンのデザイン:

スキャンボタン、スキャンした内容を表示するLabel、リセットボタンの3つで構成。

.                     

プログラム(ブロック):

1. 初期化は、resetボタンを無効にして、背景色を薄グレーに。

2. Scanボタンをタップすれば、BarcordeScannerがスキャンしてくれる

3. スキャンが終わると、スキャンした内容を3つに分解し、改行(\n)で連結の上、Label (showContent) に表示。

同時に、その内容をTextToSpeech componentを使って音声で伝えてもらう。

リセットボタンを有効にして、同ボタンの背景色を薄緑色に設定する。

リセットボタンはshowLabelをブランクにするだけです。

たったこれだけのアプリです。今回は、一回スキャンしたら終わりだが、数回スキャンして、合計金額も表示されるようにしたら少しは面白くなるかも。。。また、MIT App Inventorの翻訳componentを使って英語とか他の言語で話してもらうことも可能かな???====>>>>でも、もうこれ以上、手を加えたくないアプリ。

日本語の読み方がちょっとおかしい箇所(ひらがなに変更すれば解決か?)もあり、翻訳なんかするともっとおかしくなるかもしれない。アンドロイド・スマホの写真カメラアプリでQR codeを読み取ってくれることを初めて知った。こっちの方が実用性高い。

(そう言えば、マリオ3がそのままになってる!ブロックが多いので、間が空くと、キャッチアップが大変!今夜でも考えてみよう。)


MIT App Inventorで遊ぶ (ミラリング)

2024-04-01 08:01:49 | 日記

Macにミラリング・ソフト(X-Mirage)をインストールした。スマホの画面(アンドロイド/iPhone両方に対応)をMacのモニターに映し出すソフト。

YouTubeなどで、パソコンの画面とスマホの画面が一つの画面に収まっている投稿をよく見るが、それが可能になったというもの。ちょっとやってみたかった。まあ、2,700円程度の出費だし。

早速、Journalアプリを操作しているところを、Firebase側の反応と一緒に録画してみた。(途中で、Updateボタンと間違ってDeleteボタンをタップしたところがあるが)

正に、App in actionを確認できる便利なソフトだ。

なお、ビデオの編集は、急遽インストールした無料のDaVinci Resolve 18というソフトで行った。YouTubeのTutorialビデオを見ながら編集したが、結構使いやすかった。(通常、ビデオを編集するときは、スマホのアプリであるVNを使っている。無料でVNはお気に入り。)

それにしても、インターネットは便利。必要に応じネットで検索して、気に入ったソフトがあれば、即ダウンロード=>インストール、即ネットのチュートリアルを見ながら使う。昔々は、そんな手軽にソフトをインストールして使うことはできなかったと記憶しているが。