🍜 おとうさん、おかあさんのためのScratchで作るプラットフォーマー入門 ③ 自由自在に動く編
作成日: 2021/09/18
0

読み飛ばして良いまえがき
前回作った左右の動き編 → https://ticketnote.dev/ticket/d4klC7IJ23v8ZtfomH4N
完成予定のScratch → https://scratch.mit.edu/projects/571121487/

今回は、新しい機能を加えるというわけではなく、①と②をくっつけて、1つのプログラムにしようというものです。
なので、動きの面白みというよりは、プログラミングとしてのテクニカルな話が主になると思います。
(プログラミング初学者にとっては…… という程度のものですが。)



本日の本題

①で作った左右の動きと、②で作った重力&ジャンプの動きを組み合わせて、左右に動いた上でジャンプもできるというものが今回の目標です。

さて……
②に①で作ったコードを持ってきたいのですが、Scratchではプロジェクト跨ぎのコピペができません。
ただバックパックというものを使うとスプライトを持ち回れるようになるので、今回はそれで①の猫を②に持ち込み、それ経由で②の猫に両方の機能をもたせます。

まず①の時点のファイルを開いて…… バックパックというのは画面下に折りたたまれているものですが、これを選択して開いた状態にしてください。こんな状態になっているはずです。
①のファイルのサンプル → https://scratch.mit.edu/projects/571158066/
scratch.mit.edu_projects_571158066_editor_(PC キャプチャー用)_1.png
ここに猫をドラッグ・アンド・ドロップしてください。①はこの時点で閉じて良いです。

次に②のファイルを開いて、バックパックに猫が入っていることを確認してください。
②のファイルのサンプル → https://scratch.mit.edu/projects/571959279/
scratch.mit.edu_projects_572001196_editor_(PC キャプチャー用)_2.png

この時点でバックパックの猫を②のスプライト管理の領域までドラッグ・アンド・ドロップするとこんな風になります。
scratch.mit.edu_projects_572001196_editor_(PC キャプチャー用)_3.png
この時点でスプライト3のコードをスプライト1にコピペすると統合完了です。

スクリーンショット 2021-09-18 22.50.22.png
スプライト1がこんな風になっていればOKです。
スプライト3とバックパックの猫は削除しておきましょう。
この時点のサンプル → https://scratch.mit.edu/projects/572001196/

では、プログラムを動かしてみてください。

普通に、左右に動いて、重力の表現やジャンプもできます。
今回の目的はこれで達成。 🎉🎉🎉



ただ…… このままだと今後が辛いので、この時点でコードの整理整頓をしましょう。

緑の旗からスタートするコードが2つあるのですが、これを1つの緑に旗にまとめたいです。
乱暴にまとめると……
スクリーンショット 2021-09-18 23.09.24.png
こんな風になるのですが、これだと流石にわかりづらくて、どこで何をしているのかは、ぱっと見わかりません。
作った僕ですら半年後に、これを見てすぐに直せと言われたら嫌な気分になります。
仮にコメントを入れておいても理解するのに時間がかかると同時に、改変時に不本意な挙動になることも考えられます。

なので役割ごとに機能を細かく分けて、わかりやすくしてあげることが重要です。

ブロック定義というものを使います。

まずは「初期設定」「左右の動き」「重力&ジャンプ」という3つのブロックを作り、それぞれ分解しました。
スクリーンショット 2021-09-18 23.15.20.png

せっかくここまでやったので、変数を使って動きの調整で入れている変数も共通管理し、いちいち関連する数字をコピペしないで良いようにします。
手打ちやコピペは、入力ミスや、作業し忘れが発生するのでそれを避けるためというのと、「初期設定」は後々調整のためにいじる可能性がある、「左右の動き」や「重力&ジャンプ」は基本的には触らないというのも明確化できるというのは後々便利ですね。😎

変数に「左右の加速」「左右の最大値」「左右の減速」「ジャンプの大きさ」「重力」を作り、初期設定の箇所で数値を決定するようにしました。プラスマイナスが反転するところは * -1 で行い、入力する箇所を減らしています。
あと①のコードを書いた時点でScratchに絶対値があることを忘れていたので、そこを直しています。
「左右の動きの絶対値」は、仮に「左右の動き」が -0.1 の場合も、0.1として扱ってくださいという意味です。これをすると良いのは、仮に -0.2 〜 0.2 の範囲というのをコードで書こうと思うと、①の時に書いていたように、「左右の動き」<0.2 かつ 「左右の動き」>-0.2 みたいな書き方になるのですが、これを今回のように 「左右の動きの絶対値」 < 0.2 となるように書けます。😎
スクリーンショット 2021-09-19 15.56.12.png
この時点のサンプル → https://scratch.mit.edu/projects/572014003/

今回はコードの整理整頓が主だったので、ちょっと眠くなりがちでしたが、「左右の最大値」や「左右の加速」の数字を1回書き換えるだけで調整ができるようになるので、キャラクターやゲームバランスの調整etc.が捗るようになりましたね。また変数をいろいろいじってみて「むふふふ……。」となっていただければ。



シリーズ「おとうさん、おかあさんのためのScratchで作るプラットフォーマー入門」



Twitterもやっているので、よかったらフォローしてください。
https://twitter.com/Kaitou1192


本業はコードを書かせてもらえないフロントエンドエンジニアです。 こんなサービス作っています。 https://lp.re-shine.jp