#009 ロケットを矢印キーで動かす作り方｜条件分岐の使い方

さぁ、スクラッチでナニ作る！？

ずっとループの中に4つの「もし〜なら」を並べる設計が効いている。各条件は独立しているため、2つのキーを同時に押したとき、それぞれの処理が実行されて斜め移動が自然に生まれる。排他的な分岐ではなくフラットに並べるだけで組み合わせの可能性を引き出せているのが面白い。コスチューム切り替えも同じブロック内に収まり、アニメーションと移動が一体になっている。どんな組み方でこの仕組みが動くのか、作り方を見ていこう。

動画で見てみよう

チュートリアルの元になった作品

今回の目標

スターター作品をリミックスしよう

このチュートリアルにはスターター作品があります。使わなくても大丈夫だけど、最低限の素材などが用意されてるので便利です。
スターター作品をダウンロード

#1初期設定と右移動

準備

スプライト「ロケット」を開く

ロケット

スプライトについて
矢印キーで上下左右に移動するロケット。移動するたびにコスチュームが切り替わりアニメーションする。
どんな役割か
ロケットを矢印キーで動かせるようにするよ！右・左・上・下のキーを押すとそれぞれの方向に10ずつ進むんだ。動くたびにコスチュームが変わって、アニメーションっぽく見えるのがポイント！

実装

コスチュームにはロケットを全種類追加しておこう

緑旗でスタートしたらサイズを65%にして画面中央に配置、「ずっと」のループもおなじみだよね。

#2移動を作る

ここからが今回のポイントで、ループの中に制御もし ( ) ならを入れるんだ。右矢印キーが押されてるかを判定して、押されてるときだけx座標を10変えて右に進む仕組みになってる。

動くたびにコスチュームも切り替わるから、アニメーション付きでロケットが飛んでいく。「ずっと」で常にチェックしつつ、「もし〜なら」で条件を満たしたときだけ処理する——もしこの条件分岐がなかったら、キーを押してなくても勝手に動き続けてしまう。これが条件分岐の基本的な考え方。

[talk]ちなみにx座標とy座標って、算数や数学で出てくるグラフとまったく同じ仕組み。Scratchの画面はxが-240〜240、yが-180〜180の座標平面で、x座標を+10で右、-10で左、y座標は+で上、-で下に移動するんだ。ゲーム開発でもキャラの位置管理は全部この座標の考え方がベースになってるよね。[/talk]

#3左と上の移動

右への移動ができたから、同じ仕組みで左と上にも動けるようにしていこう。左矢印キー用の制御もし ( ) ならではx座標を-10ずつ変えて左に進む——右が+10で左が-10、符号を逆にするだけ。上矢印キーはy座標を10ずつ変えて上に移動するんだ。

[talk]「もし〜なら」ブロックって、実はほとんどのゲームの操作に使われてるんだよね。スマホゲームも裏側では「画面がタップされたなら」「敵に当たったなら」みたいな条件分岐がびっしり。たった1種類のブロックでキャラの操作からゲームオーバー判定まで作れちゃうんだ。[/talk]

#4下移動で完成

下矢印キー用の制御もし ( ) ならでy座標を-10ずつ変えるよ。これで制御ずっとの中に4つの「もし〜なら」が並んだ状態になった。それぞれが独立して判定されるから、右と上を同時に押せば斜めにも飛べるんだ。

条件分岐の基本はこれでバッチリ。次回はイベント入力について学んでいくよ！

まとめ

今回は「もし〜なら」を使って、矢印キーでロケットを4方向に動かせるようにしたよ。大事なのは条件が独立してるから複数のキーを同時に押しても斜め方向に飛べるところ。次回はイベント入力について学んでいくよ！