さて、前回RPGのマップを作ろう!でマップを作りましたが
今回はそのマップを動き回るプログラムを作っていきましょう。
本来、RPGのマップはマップを細かいパーツにわけて
プログラムでつなぎあわせていき
マップで通れる所と通れない所の判定をする・・・という手間があるのですが
スクラッチでもっとお手軽にマップを動き回る方法をご紹介します。

(マップの素材:First Seed Material )
くわしくは、「続きを見る」でご覧ください。
画像のサイズが480×384ピクセルになると思います。
(マップチップの大きさを32ピクセルで作った場合)
このままScratchに取り込むとタテのサイズが大きいので
自動的に画面に収まるように小さくされてしまいます。
まずは画像の大きさを480×360になるように調節しましょう。

保存したマップをペイントで開きます。
画像ファイルを右クリック → 「プログラムから開く」→「ペイント」を選びます。

ペイントをひらいた後、画像の下のフチにカーソルを合わせると
両矢印のアイコンが表示されます。
この状態で、画像のフチをクリックしてつかみ、ドラッグします。

ドラッグすると、画面下の画像のサイズが変わるのがわかるでしょうか?
タテ幅が360pxになったところでクリックをはなしてください。

あとはファイルの「上書き保存」をすれば完了です。

スクラッチの画面の左下にある「ステージ」という部分をクリックします。

背景のリストが表示されますので
新しい背景の「ファイルから新しい背景をアップロード」のアイコンをクリックして
さきほど編集したマップの画像を選びましょう。
タテヨコに隙間なくマップが表示されればOKです!
スキマができた場合には、画像のおおきさをもう一度確認してみましょう。
とりあえず、ネコが大きすぎるので、大きさを40%くらいにします。
そしてカーソルキーで動くようにしていきましょう。

はい!カンタンですね。
左右キーでx座標を、上下キーでy座標を変えています。
ただこの方法だと
柵の上や箱の上も、ザクザク進んで行ってしまいますね。

通っていいところ、ダメなところを判定するにはどうしたらいいでしょうか?

「新しいスプライトを描く」を押してスプライトを追加してください。

そしてペイントモードで、こんなふうに
通ってはいけないところを黒く塗っていきます。
ステージ画面にも描いた絵が表示されますので
ステージを見ながら、調節していきましょう。

描き終わったらこんな感じになります。
このままではマップが台無しなので

このスプライトの「幽霊」の効果を100にしておきましょう。
「隠す」ブロックではなく「幽霊」の効果にするのがポイントです!

スプライトの名前も付けておきましょう。
今回は「通行不可」という名前にしました。
そして、ネコのスクリプトも変更しましょう!

こんな感じです。
「通行不可」のスプライトに触れたら、移動したぶんを戻しています。
こうすることで通れないようになります。
通行不可のスプライトを「隠す」にすると
当たり判定がなくなってしまうので注意です。
ネコの耳の先まで当たり判定がはいってしまうので、違和感があるときは
通行不可のスプライトを微調整してみて下さいね。
次回はキャラクターも変更して、アニメーションさせていきますのでお楽しみに!
今回はそのマップを動き回るプログラムを作っていきましょう。
本来、RPGのマップはマップを細かいパーツにわけて
プログラムでつなぎあわせていき
マップで通れる所と通れない所の判定をする・・・という手間があるのですが
スクラッチでもっとお手軽にマップを動き回る方法をご紹介します。

(マップの素材:First Seed Material )
くわしくは、「続きを見る」でご覧ください。
マップの大きさを整えよう
前回紹介した方法でマップを作った場合画像のサイズが480×384ピクセルになると思います。
(マップチップの大きさを32ピクセルで作った場合)
このままScratchに取り込むとタテのサイズが大きいので
自動的に画面に収まるように小さくされてしまいます。
まずは画像の大きさを480×360になるように調節しましょう。

保存したマップをペイントで開きます。
画像ファイルを右クリック → 「プログラムから開く」→「ペイント」を選びます。

ペイントをひらいた後、画像の下のフチにカーソルを合わせると
両矢印のアイコンが表示されます。
この状態で、画像のフチをクリックしてつかみ、ドラッグします。

ドラッグすると、画面下の画像のサイズが変わるのがわかるでしょうか?
タテ幅が360pxになったところでクリックをはなしてください。

あとはファイルの「上書き保存」をすれば完了です。
マップ画像を背景に表示しよう
スクラッチにマップの画像を取り込みましょう。
スクラッチの画面の左下にある「ステージ」という部分をクリックします。

背景のリストが表示されますので
新しい背景の「ファイルから新しい背景をアップロード」のアイコンをクリックして
さきほど編集したマップの画像を選びましょう。
タテヨコに隙間なくマップが表示されればOKです!
スキマができた場合には、画像のおおきさをもう一度確認してみましょう。
マップを歩き回ろう
さっそくネコちゃんを歩き回らせてみましょう。 (ドット絵のキャラクターの使い方は次回説明しますね)とりあえず、ネコが大きすぎるので、大きさを40%くらいにします。
そしてカーソルキーで動くようにしていきましょう。

はい!カンタンですね。
左右キーでx座標を、上下キーでy座標を変えています。
ただこの方法だと
柵の上や箱の上も、ザクザク進んで行ってしまいますね。

通っていいところ、ダメなところを判定するにはどうしたらいいでしょうか?
障害物の当たり判定
障害物の当たり判定をするために、スプライトを一枚用意します。
「新しいスプライトを描く」を押してスプライトを追加してください。

そしてペイントモードで、こんなふうに
通ってはいけないところを黒く塗っていきます。
ステージ画面にも描いた絵が表示されますので
ステージを見ながら、調節していきましょう。

描き終わったらこんな感じになります。
このままではマップが台無しなので

このスプライトの「幽霊」の効果を100にしておきましょう。
「隠す」ブロックではなく「幽霊」の効果にするのがポイントです!

スプライトの名前も付けておきましょう。
今回は「通行不可」という名前にしました。
そして、ネコのスクリプトも変更しましょう!

こんな感じです。
「通行不可」のスプライトに触れたら、移動したぶんを戻しています。
こうすることで通れないようになります。
通行不可のスプライトを「隠す」にすると
当たり判定がなくなってしまうので注意です。
まとめ
どうでしたか?ちゃんと通れなくなっていましたか?ネコの耳の先まで当たり判定がはいってしまうので、違和感があるときは
通行不可のスプライトを微調整してみて下さいね。
次回はキャラクターも変更して、アニメーションさせていきますのでお楽しみに!
コメント