Scratchには、背景をスクロールさせるブロックはありませんが、配置した木や建物などのスプライトを動かすことで、背景が動いているように見せることができます。
前回に引き続き、この「背景が動いているように見せる」設定について紹介していきます。
進行方向から新たなスプライトを表示させる
前回の記事では、アプリ起動時にすでにあった木を左側に動かしました。今回は、ネコのキャラがさらに先に進んだように見えるよう、最初の時点では見えていなかったものが見えてくる仕組みを作ります。
青い木を追加して表示する
まずは「青い木」です。青い木のスプライトをライブラリから追加して設定しましょう。
この木は、ネコの進行方向（例の場合は右側）に見えてくるようにしたいので、ステージの右端ギリギリくらいになるように座標を指定します。
さらにアプリの起動時は見えないようにしておきたいので、「みどりの旗をクリックしたとき」のブロックに、「見た目」にある「隠す」ブロックを付けて、まずは非表示にしておきます。その後、10秒待ってから表示されるようにブロックをつなげました。
移動用のブロックをつなげる
青い木も、最初から表示されていた木と同じように左に流れていく動きをさせたいので、先に作った木が左に移動していくブロックをバックパックから持ってきてひとまずつなげます。
バックパックの使い方は、こちらの記事で紹介していますので、分からない場合はチェックしてみてください。
左端で消えるかを確認しよう
使用しているスプライトによっては、コピーしたブロックのx座標では端についても非表示にならない場合があります。図の例では青い木は、左端まで移動しないうちに止めることになるのでとりあえずそのままにしていますが、必要な場合は左端できちんと非表示になるかを確認して調節しましょう。
青い木に合わせたセリフをネコに追加する
青い木が見えてきたタイミングで言わせたいセリフをネコに追加しました。今回は図のように「みどりの旗がクリックされたとき」から何秒後という設定でセリフを追加しています。
到着地点となる「くま」を追加する
新たなキャラとして、ライブラリからくまのスプライトを追加しました。
出てくる場所、左への動き方は「青い木」と同じでOKなので、上で設定した「青い木」のブロックをバックパックを利用してコピーしましょう。その後、表示する秒数を若干遅らせればOKです
実行してみると、青い木が見えてきたあと、くまも見えてきます。
しかし青い木とくまの左への移動の指示が「ずっと」のため、ネコを通り過ぎてしまいました。
目的地到着時に「移動している様子」が止まるようにする
今回のアプリは、ネコとくまが待ち合わせしている設定なので、くまのところにネコがきたら、移動の動きが止まるように指示を出していきます。
くまを止めつつ、きっかけのメッセージを作る
くまがネコの前辺りにきたら、ちょうどよい位置に来たことを他のスプライトに知らせるメッセージを送り、自分（くま）の移動を止めるようにしたいと思います。そこでくまのブロックを以下のように変更しました。
- 「もし」ブロックの位置を「x座標＝45」にする
- 「x座標＝45」になったら「とうちゃく」というメッセージを送る
- 「x座標＝45」になったら「このスクリプト」を止める
この状態で実行してみると、このようにちょうどよい位置でくまが止まりました。
タイミングを合わせて青い木とネコの足も止める
くまと同時にストップするよう、青い木のスクリプトにもブロックを追加します。
くまが送った「とうちゃく」のメッセージをきっかけに止まるようにすれば、タイミングを揃えて止めることができます。
ネコの足踏みも同じタイミングで止まるようにしましょう。こちらも「とうちゃく」のメッセージをきっかけにして、スクリプトを止めるブロックを追加すればOKです。
セリフを足すなど微調整して完成
今回は、シチュエーションに合わせてネコの方にはこんな具合にセリフを足しました。次女得意の時間差攻撃なので、小さな子どもでも組めますね。
さらにくまの方には、到着後に手を上げるコスチュームに見た目を変えて、セリフを言わせるスクリプトを付けました。
このおかげで、最初に手を下げているコスチュームに変更する必要も出てきたので、冒頭にコスチュームを指定するブロックを追加しました。
これで完成です。
実行してみると、背景が流れてネコが移動しているように見えます。そしてクマと合流したところで止まりました。
「背景が動いている」ように見せる設定はこれで終了です。次回は、新たなアプリ作りに挑戦する予定です。
