プレイヤーを表示しよう

今回作るのはレーシングゲームなので、プレイヤー(車)をユーザが操作します。
まずはプレイヤーを表示してみましょう。

このレッスンでは、プレイヤーとして車の画像ではなく、ただの四角形を表示することにします。
車の画像を読み込んで表示させる方法はコースの最後に説明します。

それでは、コード全体を次のように変更してください。

function setup() { createCanvas(400, 400); rectMode(CENTER); } function draw() { background(0); rect(200, 200, 30, 30); }

前回のレッスンのコードに、2つのコードを追加しました。

rectMode(CENTER);

これは、指定した座標を中心として四角形を描画するという意味のコードになりますが、よく分からなければいったん理解せずに進んでも大丈夫です。

rect(200, 200, 30, 30);

このコードで、ゲーム画面上に四角形を表示します。
rect が四角形を描画するという指示になります。数字が、位置とサイズを表しています。

rect(X座標, Y座標, 幅, 高さ);

という指定方法になるので、

X座標が200 Y座標が200 幅が30 高さが30

の四角形を描画するという意味になります。
今、ゲーム画面のサイズは400×400なので、画面の真ん中に四角形が描画されます。

四角形の描画

それではスタートボタンを押してみましょう!

プレイヤー

無事に表示されましたか?
でもまだ画面の真ん中に表示されるだけで、何も操作できませんね。
次のレッスンでは、プレイヤーをユーザが操作できるようにします。

オンライン相談

つまづいたときは

レーシングゲーム
レッスン一覧

はじめに

コース一覧

ゲーム開発コース

数学コース

アートコース

入門コース

このサイトについて


© 2022 ルートアイ All rights reserved.