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

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

MIT App Inventorで遊ぶ (マリオ その1)

2024-03-20 09:07:54 | 日記

ちょっと気分を変えるため。。。

<マリオ その1>としたが、その2、その3が続くかどうかはわからない。

その1で終わりとなる可能性もある( ˃̣̣̥ω˂̣̣̥ )。

以下YouTuber Azaotl のビデオを見て、キャラクターがジャンプしたりしてお宝を獲得していくようなゲームが作りたいと思った。

Mario run Game for App Inventor | Scrolling background part 01

背景を動かし、キャラクターを動かすまでは、このビデオ通り作っていけばいいのだが、障害物にジャンプして飛び乗ったりするにはどうすればいいのか????

そして、試行錯誤の結果、流れてくる丸太(?)に飛び乗るところまでは出来た。Tutorials Azaotl のビデオチュートリアルに随分助けられながら。。。(キャラクターはネットよりダウンロードしたものなので、copyrightの問題あるのかどうかちょっと気になるが。。。YouTubeのチェックはパスしたが。。。)画面をタップしたらジャンプするようになっている。

ポイント:

1. キャラクター:"spritesheet mario walking"でググって問題のなさそうな画像を選び、ダウンロードし、画像アプリ(Affinity Photo)でキャラクターを切り取って作っていくことになったが、苦労した。私の場合、歩いている感じが出るように11個のpngファイルに切り分けた。

同じくAzaotlさんのYouTubeを見ながら作った。

Mario run Game tutorial for App Inventor | getting mario sprites part 02 | gimp

2. Azaotlさんは全てプログラム(ブロック)で設定していくやり方なので非常に面倒だった。ブロック数も多くなるし。

3. 飛び乗るところのブロックは以下の通り。この部分のみ(ここだけ!!!)オリジナルなので紹介。

Canvas componentの上にImageSpriteとしてキャラクターと丸太を配置しているが、x, y座標の0, 0は左上端。丸太は、幅がscreenの3倍の幅を持つCanvas上を左から右へ移動する。

丸太が左から右へ移動するが、キャラクターが丸太の下を歩いている間はジャンプ出来ないようにした。(ブロックが長いので二つに分割した。)

即ち、こういうことか。自分で作ったが、頭が混乱し、これで良いのかもわからない。でも、動く!

また、キャラクターがジャンプして、落ちていく時に丸太(blockSprite)と衝突したら、キャラクターの位置は丁度丸太の上になるようにした。

丸太(blockSprite)との衝突(接触している状態)が解除されたら、また地面を歩くようにキャラクターのy座標を元に戻す。

 

4. 当面は、敵と出会った時の対応をどうするか(回避策はあるか?)、丸太の上にお宝を置いておいてゲットしたらポイントを取得するとか、その他色々考えてみたい。チュートリアルもたくさんあるので参考にしつつ、時間がかかっても少しでもオリジナルなものにしていきたい。(オリジナルなものにするには、あまりチュートリアルを見ないことだが)

これを作って、背景がスクロールするゲームの作り方の「基本の基本」のようなものが少し理解したように思える。(楽観的だが)大きな収穫。大宇宙でエイリアンを迎え撃つようなゲームもできるかな???この時のスクロールは上から下の方向になるのかな?後方より前方へスクロールさせることができれば最高なんだけど(ImageSpriteのz軸を使う感じ)。

アイデアだけは少し出てくるが、実現できるかは?という感じ。でも、こちらは後期高齢者で時間だけはた〜っぷりあるので(成仏するまでという制限はあるが)。。。心配していない。。。

まあ、自分ですべてコーディング(ブロックでコーディング)したのではないが、一応自分のアプリでもあり、タップするとジャンプし、丸太に飛び乗ったり、楽しい。

 


MIT App Inventorで遊ぶ (運試しお助けアプリ1)

2024-03-20 07:15:26 | 日記

6個又は7個の数字を当てる宝くじLOTO。時々購入しています。ごくごく稀に当たります。

その数字を生成してくれる簡単なアプリ。

アプリ実行画面:

スクリーンデザイン:

右側のAI Componentsの下の方に「ListUtilz1」というcomponentがあるが、これは、listのソートなど、多くの機能を持っているとても便利なextension。

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

1. 変数pickCountは、LOTO6の場合は6、LOTO7の場合は7。デフォルトは6。7番目の数字を表示するLabel "num7"は非表示。

2. LOTO6用(pickRandomNum6)=> 1から43までの数字をランダムに選択

    LOTO7用(pickRandomNum7)=> 1から37までの数字をランダムに選択

3. 変数lottoNumListの項目数が6又は7となるまで、ランダムにピックアップした数字を同変数に追加していく。

    但し、ランダムにピックアップした数字が既に変数lottoNumListにある場合は、その数字をスキップする。(重複を避ける)

    (lottoNumListはスペルがおかしい。本当はlotoNumListとすべきところ)

    最後に、extensionブロックを使ってlottoNumListを昇順にソートする。

    (正式なextensionsについては、こちら。でも、正式ではないものは、数えきれないほどあるし、便利なものも多く、ググればすぐ見つかる。)

4. lottoNumListに保存された数字を順番にLabelに表示していく。

    pickCountが7の場合、すなわちLOTO7の場合は、7番目のLabelにも数字を表示する。

5. LOTO6又はLOTO7を選択するSwitch component。

    デフォルトのswitchはOffの状態(thumbが左側にある状態)で、この場合はLOTO6、switchがOnの状態(thumbが右側に移動した状態)はLOTO7。On/Offの状態に合わせ、文字の色、num7(Label)の表示・非表示を設定。

6. procedure "clear"。表示した数字を消しLabelをブランクにする。

現在は、一組しか表示されないが、次は、複数組の数字を表示すること。