スクラッチプログラミング - よこへスクロール!はいけいをうごかそう
はいけいがよこにうごいているようなプロジェクトをつくってみましょう。はいけいとしてつかうスプライトをはしからはしへうごかすと、スクロールしているように見せることができますよ。
サンプルさくひんをみてみよう
今回(こんかい)は、はいけいをスクロールさせる方法(ほうほう)をしょうかいします。
(プロジェクトがひょうじされないばあいは、ScratchのPyxofyページをごらんください)
ネコとオウムはコスチュームをきりかえているだけで、そのばから移動(いどう)していません。でも、右へすすんでいるように見えますよね。
どうやってスクロールさせてるの?
はいけいがよこにうごいているように見えるのは、木や草などが左へうごいているからです。
![背景の絵が左へ動き続ける 背景の絵が左へ動き続ける](https://www.pyxofy.com/content/images/2021/09/move-to-left.jpg)
はいけいといっても、ステージに設定(せってい)するはいけいには「うごき」のブロックがつかえないので、うごかすことができません。
スクロールさせるためには、スプライトをはいけいとしてつかうところがポイントです!
はいけいをスプライトでつくろう
はいけいとしてつかうスプライトを、じぶんでえがいてみましょう。
![背景として使うスプライトを描く 背景として使うスプライトを描く](https://www.pyxofy.com/content/images/2021/09/draw-sprite-1.jpg)
- スプライトのなまえを、「はいけい1」にする
![描いた背景のスプライトの名前を変える 描いた背景のスプライトの名前を変える](https://www.pyxofy.com/content/images/2021/09/rename-sprite.jpg)
ざひょうをしらべよう
スクロールさせるためには、はいけいをステージのいちばんはしまでうごかすひつようがあります。
「はいけい1」の座標(ざひょう)をしらべてみましょう!
「ひだりはし」のざひょうをしらべる
スプライトをずっと左へうごかすと、いちばん左はしの座標(ざひょう)がわかります。
つぎのようにブロックをくみあわせたら、ブロックをタップしてみてください。
- 「ずっと」
- 「(-10)ほうごかす」
![スプライトがステージの左はしから少しだけ見えている状態 スプライトがステージの左はしから少しだけ見えている状態](https://www.pyxofy.com/content/images/2021/09/forever-move-negative-10-steps.jpg)
「はいけい1」が、いちばん左はしへ移動(いどう)しました!
ステージの下を見てください。xざひょう「-469」まで表示(ひょうじ)できることがわかりますね。
「みぎはし」のざひょうをしらべる
こんどは、右はしの座標(ざひょう)をしらべましょう。つぎのようにブロックをくみあわせたら、ブロックをタップしてみてください。
- 「ずっと」
- 「(10)ほうごかす」
![スプライトがステージの右はしから少しだけ見えている状態 スプライトがステージの右はしから少しだけ見えている状態](https://www.pyxofy.com/content/images/2021/09/forever-move-10-steps.jpg)
「はいけい1」が右はしへ移動(いどう)して、xざひょう「469」まで表示(ひょうじ)できることがわかりました!
はいけい1をプログラミングしよう
いましらべた座標(ざひょう)をつかって、ステージの右から左へうごきつづけるように、プログラミングしましょう。
- さいしょは、ステージのまん中に表示(ひょうじ)する
![x座標を0、y座標を0にしてステージの中央に表示する x座標を0、y座標を0にしてステージの中央に表示する](https://www.pyxofy.com/content/images/2021/09/set-x-0-y-0.jpg)
- ずっと、左へうごかす
![-3ほうごかすをずっとで囲んでつなげる -3ほうごかすをずっとで囲んでつなげる](https://www.pyxofy.com/content/images/2021/09/forever-move-negative-3-steps.jpg)
- いちばん左はしまでうごいたら
![もしxざひょう=-469ならブロックをずっとの中に追加する もしxざひょう=-469ならブロックをずっとの中に追加する](https://www.pyxofy.com/content/images/2021/09/if-x-equal-negative-469.jpg)
- いちばん右はし、「xざひょうを(469)にする」
![もしならブロックの間にxざひょうを469にするを追加する もしならブロックの間にxざひょうを469にするを追加する](https://www.pyxofy.com/content/images/2021/09/then-set-x-469.jpg)
プログラムかんせい
「はいけい1」が左へうごきつづけるようになりました!
左はしまでうごいたあとは、右はしに表示(ひょうじ)されます。そしてまた、左へうごきます。
![はいけい1の完成プログラム はいけい1の完成プログラム](https://www.pyxofy.com/content/images/2021/09/background1-program.jpg)
ふたつめのはいけいをつくろう
はいけいとしてつかうスプライトを、もうひとつ用意(ようい)しましょう。ふたつのはいけいがつながってうごいているように、プログラミングしていきますよ。
スプライトをコピーする
おなじスプライトをつかいたいときは、かんたんにコピーすることができます。
- 「はいけい1」をえらんで、ながおし(パソコンでは右クリック)
- 出てきたメニューから、「ふくせい」をえらぶ
![スプライトを右クリックするとコピーするメニューが出る スプライトを右クリックするとコピーするメニューが出る](https://www.pyxofy.com/content/images/2021/09/duplicate-sprite.jpg)
スプライトがコピーされて、「はいけい2」ができました!「はいけい1」でつくったプログラムも、そのままコピーされます。
![背景1がコピーされて背景2ができた 背景1がコピーされて背景2ができた](https://www.pyxofy.com/content/images/2021/09/background2.jpg)
はいけい2をプログラミングしよう
「はいけい1」は、さいしょにステージのまん中に表示(ひょうじ)しましたね。「はいけい2」は、ステージの右はしからスタートしますよ。
「はいけい1」の右がわにつながってうごき出すイメージです。
![背景1の右隣に背景2がつながって表示されている画像 背景1の右隣に背景2がつながって表示されている画像](https://www.pyxofy.com/content/images/2021/09/backgrounds-starting-position.jpg)
さいしょのxざひょうを「469」にかえましょう。
![最初のx座標を469にしてステージの右端に背景2が表示されている 最初のx座標を469にしてステージの右端に背景2が表示されている](https://www.pyxofy.com/content/images/2021/09/set-x-469-y-0.jpg)
プログラムかんせい
ふたつのはいけいがつながって、左へスクロールするようになりました!
![背景2の完成プログラム 背景2の完成プログラム](https://www.pyxofy.com/content/images/2021/09/background2-program.jpg)
![](https://www.pyxofy.com/content/images/2024/07/cover-page-320-4.png)
「きょうからはじめるスクラッチプログラミング入門」by Pyxofy
Pyxofy から Scratch の基本をまとめた電子書籍を出版しました。
Apple Books・Kindle でご購入ください。
まとめ
今回(こんかい)は、はいけいをよこにうごかす方法(ほうほう)をしょうかいしました。
スプライトをステージのはしからはしまでうごかしつづけると、はいけいがうごいているようなプロジェクトをつくることができます。
次回(じかい)は、はいけいをスクロールさせながらあそぶ《ジャンピングゲーム》をしょうかいします。
\この記事が参考になったら Tweet おねがいします/