【Scratch入門】はじめてのScratchアプリ作成〜スプライトを自由に歩かせてみよう
※ 当ページには【広告/PR】を含む場合があります。
2020/06/01
2022/07/27
今回はScratch猫のスプライトを使って、画面内を自由に動き回るプログラムを作成してみましょう。
なお学習する内容のレベルで出来上がるプログラムの完成品は以下のようなものです。
では早速以下で、スプライトを動かすポイントを解説していきます。
端に当たって歩く方法を変える
まずは猫のスプライトを左右に移動させて、端っこで跳ね返るだけのプログラムを作成します。
以下の図のようにブロックを組み上げます。

10歩分を100回繰り返すプログラムです。 ただし、画面の端に当たると、スプライトの向きが左右でひっくり返ります。
実際のプログラムはこのように動きます。
このプログラムの動作中に注目したいのは、画面の下にあるスプライトの位置の情報です。

x
y
また、スプライトの
向き
0
90
180
-90
この
向き
ランダムを使った歩行
次にプログラミングの重要な考え方の1つである、
ランダム数(乱数)
先ほどのブロックを以下のように、
動き
~度に向ける
演算
○から○までの乱数

このプログラムは以下のように動きます。
これだと猫が1回進むたびに、どこかの方向へランダムに向こうとするので、動きがギクシャクしてみえます。 そこでもう少し動きが自然になるように、
○歩進んで、□秒止まって、△度の方向に進み出す
先程のブロックを変更しますが、以下のように3つのランダム数が出現するので少し複雑です。

修正したプログラムは以下のように動きます。
これでスプライトが画面の枠の中を自由に歩き回るプログラムが出来ました。
障害物に当たった時の方向転換
スプライトは端にあたって折り返すだけでしたが、画面内の障害物でも同じように進行方向を変えたりすることができます。
障害物に当たると跳ね返るようにしたいので、
〇〇に触れた
まずは障害物となるスプライトを追加します。 スプライトの追加には主に2通りの方法があります。
まず、現在のScratchの画面の右下のパネルから、
スプライトを選ぶ

その猫のアイコンをそのままクリックすると、オンラインで利用できるスプライトが表示されますので、どれかを選べば現在の画面に追加されます。

また、自分でスプライトを描くこともできます。 先程の
スプライトを選ぶ
描く

画像編集画面の詳細はここでは説明しませんが、とりあえず今回は簡単に丸を描いて障害物としました。

ということで、画面に2つ障害物を増やしたところで、以下のようにプログラミングブロックを修正しましょう。

ちなみにスプライトが合計3つになったので、スプライトの編集画面には3つのスプライトが見えていると思います。 プログラミングで猫のスプライトを動かすので、猫のスプライトを選択しているか確認する必要があります。 これはプログラミング画面の右上に出ている画像でも確認できます。

早速動かしてみると、以下のようなプログラムになりました。
障害物に当たると跳ね返っていると思います。
障害物に当たると跳ね返る処理は、Scratchで用意されているブロックにはないので、自分でプログラムを作る必要があります。 その跳ね返る処理をしているのが、下の図のブロックの部分です。

これは障害物のどちらかに当たると、現在の進行方向とは逆向きに戻るような動きをさせています。 少し難しいかも知れませんが、
逆向き
-179から0
180
0から180
180
なお、
「演算のやり方、まだよくわからない」、という方はそちらの記事で理解を深めてみてください。
まとめ
今回はスプライトの動き方の基本を学習しました。
スプライトを動かすことで、より楽しいゲーム的な要素でプログラミングができるようになると思います。
さらなるステップアップとして、移動のときにコスチューム番号をずらしてアニメーションを行うことで、歩いているように見せるようなテクニックも以下の記事で紹介しています。
スプライトの動かし方についてもっと勉強したい方は、そちらもご覧下さい。