スクラッチプログラミング - かんたん!めいろゲームのつくりかた
迷路(めいろ)の中でスプライトをうごかすゲームをつくってみましょう。画面(がめん)のタッチ、マウスポインターでスプライトをそうさします。迷路(めいろ)のかべをとおりぬけられないようにするには、どうすればよいでしょうか?
サンプルさくひんであそんでみよう
今回(こんかい)しょうかいするのは、スプライトをうごかしてあそぶ迷路(めいろ)ゲームです。
スプライトの「あおくん」をそうさして、ゴールまでうごかしましょう!
「あおくん」のそうさほうほう
- タブレット…画面(がめん)をゆびでタッチしてうごかす
- パソコン…マウスのポインターをうごかす
(プロジェクトがひょうじされないばあいは、ScratchのPyxofyページをごらんください)
このきじをよむとわかること
- 画面(がめん)のタッチ(マウスポインター)で、スプライトをうごかすほうほう
- あたりはんてい(もしなにかにふれたなら)
めいろゲームをつくろう
スプライトをそうさしてゴールをめざす、迷路(めいろ)ゲームをつくってみましょう!
【かんせいプログラム】
![迷路ゲームの完成コード](https://www.pyxofy.com/content/images/2022/02/maze-code.jpg)
1. めいろをえがく
迷路(めいろ)のはいけいをえがきます。ゴールは、かべとはちがういろでつくっておきましょう。
![右下にゴールのある迷路を背景として描く 右下にゴールのある迷路を背景として描く](https://www.pyxofy.com/content/images/2021/10/draw-backdrop.jpg)
2. そうさするスプライトをえがく
そうさするスプライトの「あおくん」をえがきましょう。
![青い丸でプレイヤーとして使うスプライトを描く 青い丸でプレイヤーとして使うスプライトを描く](https://www.pyxofy.com/content/images/2021/10/draw-sprite-1.jpg)
3. スプライトをうごかす
あおくんをそうさできるようにプログラミングしましょう。
- ステージの左上からスタートする
![スプライトを迷路のスタート位置となる左上におく スプライトを迷路のスタート位置となる左上におく](https://www.pyxofy.com/content/images/2021/10/set-sprite.jpg)
あおくんのそうさほうほうは、つぎのとおりです。
- タブレット…ステージをゆびでタッチしてうごかす
- パソコン…マウスのポインターをうごかす
マウスのポインターへむけて、うごかす
ゆびでタッチしているばしょ(ポインターのあるばしょ)へスプライトをうごかすために、
- 「マウスのポインターへむける」
- 「(5)ほうごかす」
をくみあわせます。
ゴールにつくまでうごかしつづけたいので、「ずっと」でかこむのをわすれないようにしましょう。
![スプライトをずっとマウスポインターの方へ動かすコード スプライトをずっとマウスポインターの方へ動かすコード](https://www.pyxofy.com/content/images/2021/10/point-towards-mouse-pointer.jpg)
あおくんがポインターのほうへうごくようになりました!でも、ポインターのところまでくると、あおくんはブルブルとヘンなうごきになってしまいます。
![マウスポインターのところにくるとスプライトがブルブルとうごく様子を表した画像 マウスポインターのところにくるとスプライトがブルブルとうごく様子を表した画像](https://www.pyxofy.com/content/images/2021/10/strange-movement.jpg)
これは、あおくんを「ずっとうごかす」ようにしてあるからです。
マウスのポインターまでのきょり
このヘンなうごきをかいけつするために、ブロックを追加(ついか)しましょう。あおくんがポインターにちかづきすぎないようにしますよ。
- 「マウスのポインターまでのきょり」が「5より大きい」ときだけ、うごくようにする
![もしマウスのポインターまでの距離が5より大きいなら、と組みわせたコードをずっとの中に入れる もしマウスのポインターまでの距離が5より大きいなら、と組みわせたコードをずっとの中に入れる](https://www.pyxofy.com/content/images/2021/10/distance-to-mouse-pointer.jpg)
あおくんをスムーズにうごかせるようになりました!でもこのままでは、迷路(めいろ)のかべをとおりぬけてしまいます。
![スプライトが迷路の壁を通り抜けて動いている様子 スプライトが迷路の壁を通り抜けて動いている様子](https://www.pyxofy.com/content/images/2021/10/go-through-the-wall.jpg)
かべをとおりぬけられないようにするために、「あたりはんてい」をするブロックを追加(ついか)しましょう。
4. あたりはんてい
「あたりはんてい」とは、モノとモノがふれたかどうかをチェックすることです。
かべ
- もしかべにふれたなら、うしろにさがるようにする
![もし壁の色に触れたなら-5ほうごかすコードを追加する もし壁の色に触れたなら-5ほうごかすコードを追加する](https://www.pyxofy.com/content/images/2021/10/if-touching-wall.jpg)
かべにふれたどうかは、「かべのいろ」でチェックしますよ。
![色にふれたブロックのスポイトで迷路の壁の色を選ぶ様子 色にふれたブロックのスポイトで迷路の壁の色を選ぶ様子](https://www.pyxofy.com/content/images/2021/10/choose-wall-color.jpg)
あおくんが、かべをとおりぬけられなくなりました!かべにふれると、あおくんはうしろに「-5ほ」さがります。
ゴール
- もしゴールについたなら、「ゴール!」といったあとに、プログラムをとめる
![もしゴールの色に触れたならゴールと2秒言う、全てを止めるコードを追加する もしゴールの色に触れたならゴールと2秒言う、全てを止めるコードを追加する](https://www.pyxofy.com/content/images/2021/10/if-touching-goal.jpg)
ゴールについたかどうかは、「ゴールのいろ」でチェックします。
![色に触れたブロックのスポイトで迷路のゴールの色を選ぶ様子 色に触れたブロックのスポイトで迷路のゴールの色を選ぶ様子](https://www.pyxofy.com/content/images/2021/10/choose-goal-color.jpg)
5. プログラムかんせい
迷路(めいろ)の中であおくんをそうさして、ゴールまでうごかせるようになりました!
![迷路の完成プログラム 迷路の完成プログラム](https://www.pyxofy.com/content/images/2021/10/player-program.jpg)
![](https://www.pyxofy.com/content/images/2024/07/cover-page-320-4.png)
「きょうからはじめるスクラッチプログラミング入門」by Pyxofy
Pyxofy から Scratch の基本をまとめた電子書籍を出版しました。
Apple Books・Kindle でご購入ください。
まとめ
今回(こんかい)は、スプライトをそうさしてあそぶ迷路(めいろ)ゲームのつくりかたをしょうかいしました。
「あたりはんてい」は、ゲームをつくるときによくつかうので、おぼえておきましょう。
次回(じかい)は、シューティングゲームのつくりかたをしょうかいします。
\この記事が参考になったら Tweet おねがいします/