ブロックの情報を変数に保持しよう
現在、ブロックはゲーム画面の真ん中に固定して描画されているだけですね。
次回以降のレッスンでは、下の動画のように、ブロックを動かしていきたいと思います。
そこで、今回のレッスンでは、まずブロックの情報を変数に保持しておきましょう。
ブロックを動かすということは、ブロックの座標を動かすということです。
このように、値を変化させる場合は、値を変数に保持することで実現します。
それではコードを書いていきましょう。
今回は、ブロックの X座標, Y座標, 横幅, 縦幅をすべてオブジェクトにまとめて、変数に保持します。
オブジェクトについて知りたい方は、以下の入門コースの解説をご覧ください。
オブジェクトとは - 入門コース
まずはオンライエディタの一番上の行で、変数 block
を宣言してください。
let block;
次に、setup
関数内の一番下で、変数 block
にオブジェクトを代入してください。
block = { x: 200, y: 200, w: 30, h: 30 };
これで、変数 block
にオブジェクトを代入しました。
オブジェクトには
X座標:200 Y座標:200 横幅:30 縦幅:30
という情報を格納しています。
最後に、draw
関数でブロックを描画していたコードを次のコードに変更してください。
image(blockImage, block.x, block.y, block.w, block.h);
数値を直接指定する代わりに、変数 block
に保持していた情報を取得して指定するようにしました。
コードの変更は以上になります。
無事にコードを書けたでしょうか?
よくわからなくなってしまった方は、このページ下部にコード全文を載せていますので、確認してみてください。
それではゲームを起動してみましょう。
前回のレッスンと同様に、ゲーム画面の真ん中にブロック画像が描画されていると思います。
次回以降のレッスンでは、ブロックを動かしていきましょう。