今回は、キーボードの矢印キーを使って操作する宇宙ロケットを作成します。[もし ( ) なら]ブロックを使って、加速したり減速したりできるようにします。
ステップ1
まずはプロジェクトの準備をします。
- スクラッチの画面で、左上の[作る]メニューや[私の作品]パネルの[新しいプロジェクト]ボタンをクリックするなどして、新しいプロジェクトを作成し、プロジェクト名を「宇宙ロケット」にします。
- [スプライトリスト]にあるネコのスプライトを削除し、ネコのマークの[スプライトを選ぶ]を使って、Rocketshipスプライトをプロジェクトに読み込みます。
- [ステージ]-[背景を選ぶ]を使ってStarsをプロジェクトに読み込みます。
ステップ2
Rocketshipスプライトの[コスチューム]タブを見ると分かりますが、このスプライトは宇宙船の5つのコスチュームを持っていて、これらを使うと回転しながら推進する宇宙船のアニメーションが作成できます。
- Rocketshipスプライトのコードエリアを開きます([スプライトリスト]でRocketshipを選択し、[コード]タブをクリック)。
- Rocketshipスプライトのコードエリアに、[イベント]-[緑の旗が押されたとき]イベントブロックをドラッグ&ドロップします。
- ロケットは少し大きいので、半分にします。[見た目]-[大きさを(100)%にする]をドラッグ&ドロップし、100を50に変えます。これは数値として扱われるので、半角にします。
- [制御]-[ずっと]ブロックをドラッグ&ドロップし、その中に[見た目]-[次のコスチュームにする]をドラッグ&ドロップします。
- [緑の旗]ボタンをクリックして、プログラムを実行します。ロケットは回転しますが、変化が激しすぎるので、少しの間じっとさせます。[制御]-[(1)秒待つ]を[次のコスチュームにする]の下にドラッグ&ドロップします。1を半角の0.2にします。
- [緑の旗]ボタンをクリックして、プログラムを実行します。ロケットの動きがかくかくしてかわいく見えます。
試してみると分かりますが、半角の50でなく全角の５０を入力してプログラムを実行すると、ロケットは見えなくなります。これは全角の５０が数値として認識されないことによる結果です。
[(1)秒待つ]の待ち時間を小さくするほど、ロケットは速く回転して見えます。
上図を見ながら、スクリプトのコードブロックを上から１つずつ追ってみてください。
ループに入り、1回めの待機を終えたら、2回めのループに入ります。1回めのループでのコスチュームは1(Rocketship-a)ですが、2回めのループでは2(Rocketship-b)に変わります。新しい繰り返しに入るたびに、次のコスチュームに変化するので、目の錯覚によってアニメーションしているように見えます。原理はパラパラアニメーションと同じです。
少しずつ異なる絵を高速で連続描画すると、脳がその変化についていけず、動いているように錯覚するのがアニメーションです。映画やテレビでも同じ脳の錯覚を利用して表現されています。
ステップ3
次は、キーボードでロケットの動きを操作できるようにしましょう。こういう場合、一度に多くのことをやろうとせず、一番簡単そうに思えることから始めるようにします。コンピュータ画面では、水平の右方向はプラスになるので、多くの場合で他よりも簡単です。
次のような仕組みにします。
ユーザーが右矢印キーを押したら、ロケットが右方向に移動する。
これを、コードブロックで組み立てていきましょう。
- まずは動作を開始するきっかけ(イベント)が必要です。よく分からないので、いつもの[緑の旗が押されたとき]にします。
- 「ユーザーが右矢印キーを押したら」ということなので、条件を使います。とりあえず[制御]-[もし ( )なら]にします。
- 条件の六角形には、[調べる]-[(スペース)キーが押された]を入れます。[(スペース)キーが押された]ブロックは六角形なので、そのまま条件の六角形にドラッグ&ドロップできます。(スペース)の部分は下向き矢印キーのクリックでメニューが展開できるので、(右向き矢印)を選択します。
- [もし右向き矢印キーが押されたなら]の条件ができたので、これがTRUEの場合、つまり右向き矢印キーが押されたときに実行したいことを、ブロックのへこみに追加します。ロケットを右に動かしたいので、[動き]-[x座標を(10)ずつ変える]をドラッグ&ドロップします。
- [緑の旗]をクリックしてプログラムを実行します。キーボードの右矢印キーを押します。
ロケットは右に移動しそうに思えるのですが、動きません。なぜでしょう？
実は、右矢印キーを連打しつつ、[緑の旗]のクリックを繰り返すと、ロケットはたまに移動します。しかしこれは希望する操作と動作ではありません。
[緑の旗が押されたとき]イベントブロックに吸着している以降のブロックは、[緑の旗]がクリックされた瞬間に実行されます。今の場合で言うと、その瞬間に右向き矢印キーが押されているなら、ロケットは右に10だけ移動します。つまり、[緑の旗]がクリックされた瞬間に、右向き矢印キーが押されているなら、移動するわけです。旗がクリックされたとき同時に右向き矢印キーが押されることはまずないので、ロケットは動かないのです。
キーボードだけで移動させるには、キーが押されたことをずっと監視しつづける必要があります。ずっと監視しつづけるには、[ずっと]ブロックが使用できます。
これでロケットは、右矢印キーの押し下げで右へ移動するようになります。
[x座標を(10)ずつ変える]ブロックは、スプライトのx座標を今の値より10ずつ大きくします。たとえば最初(0,20)にあったスプライトの座標は、次の実行時には(10,20)になり、その次の実行時には(20,20)になります。これによってスプライトは右に移動することになります。(10)を(-10)に変えると、左に移動します。
プログラミングでは、同じことが実行できる方法がほかにも存在する場合がよくあります。今の場合で言うと、[イベント]-[(スペース)キーが押されたとき]を、(スペース)を(右矢印)に変えて使う方法です。[(右矢印)キーが押されたとき]イベントブロックは、右矢印キーの押し下げを監視し、キーが押されたことを検知したら、以降のブロックを実行します。
今回[ずっと]ブロックを使っているのは、条件の[もし( )なら]の練習の意味もあります。通常は[(右矢印)キーが押されたとき]を使う方が手数が少なくて済むので便利です。
ステップ4
次は、左矢印キーの押し下げで、ロケットが左に移動するようにしましょう。動かす理屈は右への移動と同じで、右矢印キーを左矢印キーに、10を-10に変更します。
ステップ5
最後に、上下矢印キーでも上と下に移動するようにしましょう。
理屈は前と同じですが、キーを変えるほか、今度はx座標ではなくy座標を変更します。
[ずっと]ブロックの中には、４つの[もし( )なら]ブロックが入っています。これらは独立しています。独立しているということは、[ずっと]の繰り返しのたびに、右向き矢印キーと左向き矢印キーと上向き矢印キーと下向き矢印キーが押されているかどうかを、毎回個別に調べるということです。ということは、たとえば上矢印キーと右矢印キーが２つとも押されていることも検知できる、ということです。上矢印キーと右矢印キーが同時に押されていると、yが10大きく、xが10大きくなるので、スプライトは斜め右上に移動することになります。
こうした理屈の理解は、プログラミングを学ぶときに非常に重要です。うまく理解できない場合は、下の図を使って、４つの矢印キーとそれに対応したロケットの動きについて、整理してみてください。
ここまでのプログラムのコードは次のリンクからダウンロードできます。
