先日は、
にて、スプライトとクローンについて書きました。初期のバージョンでは、この機能は存在しなかったのですが、現在のバージョンではこうした機能が使えるので、複数のオブジェクトを生成する時に、オブジェクトの数分だけスプライトを配置する必要がなくなりました。
前回は、 【 シューティングゲームのショット 】 の実装に使えそうなものを紹介しましたが、敵キャラを出す場合も同様の方法で増やすので、用途は多い気がします。
ショットを作ったら、次は、キャラクターの移動だと思うので、今回は、キャラクターの移動について書こうかなと思います。
ス プライトを使う
Scratchでは、最初から複数の素材が用意されており、素材を選択すると、
のように画面上にスプライトを配置できます。素材には、コスチュームが福栖登録されているので、
のように実装されているコスチュームを選択して画面内に配置する事が出来ます。
そして、選択したオブジェクトに対してコードを書いていくことになりますが、
の画面でブロックを繋いでコードを作る事になります。今回は、
のコスチュームを使おうと思います。これを動かす場合、
のように旗がクリックされた時のイベントを用意して、
のように初期座標の指定と不要な物が表示されないように初期化を行いますが、このオブジェクトの座標変動だけだと問題がないのですが、今回は、 【 モーションを使う 】 ので、このスプライトは使えません。
その為、このスプライトに存在するコスチュームを歩行用のアニメーションが入ったスプライトに移動させる必要があります。
■ コスチュームの複製
スプライトは一つのオブジェクトとして管理されていますから、モーションを使う場合には、実装されたコスチュームを使用する必要があります。今回は、別のスプライトの
の中に別のスプライトの中のコスチュームを移動させます。画面左下に
のように選択の項目がありますが、ここで描くを選びます。そうするとペンタブレットや液晶タブレットなどの手書きデバイスでコスチュームを描く事が可能になります。実際にこれを選択すると、
のように空白のコスチュームが生成されます。その後、歩行ではないコスチュームに移動して、
のように使用するコスチュームを選択し、画面の上の
の 【 ＋ 】 の付いたアイコンを選んでコピーをします。そして、先ほどの
に戻って貼り付けると、
のように別のスプライトのコスチュームが追加されます。
同様の方法で、
のようにコスチュームを追加することも可能です。こうすることで、コードで呼び出して使用できるようになります。
コ ードの製作 ： アニメーションを実行する
動かすための下準備はできたので、コードを作って行きます。
まず、
のように初期化を行ます。最初に止まっている時のコスチュームにするので、先ほど追加した物を適応します。そして、
のようにずっとを指定して、その中に条件分岐を入れます。これで、プログラムを止めない限り処理が行われるようになり、そのループの中に条件分岐を入れた状態になります。
今回は、スペースキーで動かすので、
のように、キー判定を用意してスペースキーを選択し、その中に女権式を追加します。今回は、端に行くまで動く作りにします。
アニメーションが入らない移動だと、
で済みますが、今回はアニメーションを入れるので、コスチュームの変更を入れることになります。
のように最初にコスチュームの変更を行い、その後移動を入れます。ただし、この状態だと、コスチュームの切り替えが速くなるので、処理の一番最後に0..1秒のディレイを入れています。
この工程が1つのコスチュームに必要な処理になります。今回の歩行モーションは、4フレームで左右の動作になる仕様ですから、同様の物を作る事になります。
Scratchではクリックしたブロックを複製できるので、
■ コピー ： CTRL + C
■ 貼り付け ： CTRL + V
でコードやブロックを複製できます。
のようにブロックを複製して、
のように組んでいきます。これで、アニメーションで使用するコスチュームが出来上がったので、これを接続します。
これで2-3のモーションが出来たので、
のようにします。この処理がスペースキーを押すと実行されるので、壁に向かうまで1-4のスプライトの入れ替えをしながら動くことになります。
実際に動かすと、
のように歩いてくれますが。一方甲の移動で、
のような処理が必要になりますが、この時の移動速度や挙動の調整は、
で行います。
コ ードの製作 ： 移動（アニメーションあり）
先ほどのコードでは、一方甲にアニメーションをしながら歩いていくものでしたが、これをキー判定で左右に動くようにします。その場合、
のようにループ構造を用意して、その中に多重に分岐を入れる必要が出てきます。
キーの判定ですが、最初に
のように何も幼い時の判定を入れます。これを最初に入れると、一番最初にこの判定を行い、その後、押されたキーの判定を行います。
これを条件の判定に入れて、
のようにして、停止時のスプライトを指定します。
そして、
のようにキー判定を用意していきます。そして、先ほどのように
のようにモーションを追加します。この部分をもう一度作るのは大変ですが、テキストでのコーディングのようにScratchでもコードの類似した部分を選択して複製する事が出来ます。構造物の一番上のブロックをクリックした後に先ほどの方法で複製すると、
のように複製できます。この状態だと、向きの指定ができていないので、
のように向きの指定を行い、
のように 【 もし～ならば、でなければ～ 】 のブロックに先ほどの物を配置します。それを、
の開いている部分に追加すると、
のようになります。包含後に初期段階で右を向くようにするので、回転で90度回しています。この状態で実行すると、
のように動きます。
流石に、画像だけだとどう動くのか解らないので、YouTubeに実査に起動して動かした動画をアップしておきました。
■ 今回のサンプルを動かしてみた動画
コ ードの構造
今回はアニメーションが含まれているので、物凄い長さになっていますが、判定部分は、
のようになっています。今回は向きも含まれるので、
のように向きの指定を行っています。そして、アニメーションが入っているので、ディレイを入れる必要があったので、キー判定の部分に
のようにアニメーションの処理を追加しています。あと、回転を使っているので、横以外に向くこともあったので、左右のみに固定するような指定を初期設定で行っています。
今 回のコード
今回のコードでは、移動上限の設定をしていないので、必要なコードを追加していませんが、アニメーションをしながら移動するだけのコードだと今回の物になります。そして、今回作ったコードは、
な感じになっています。今回は、無駄の多いコードを書いていますが、こんな感じに条件判定でコスチュームを入れ替えて移動させると、でアニメーションをしながら動くキャラクターを実装する事が出来ます。