コースを作ろう その1

プレイヤーが表示できたので、次はコースを作っていきましょう。

最終目的は、以下の画像のようなコースを作ることです。

コースの最終目的

このコースは、以下のように複数の四角形を組み合わせることで作っています。

コースの最終目的2

そのために、まずは四角形を1つ表示させましょう。
プレイヤーの表示と同じように、四角形を描画します。

現在こうなっているコードを、

function draw() { background(0); drawPlayer(); } function drawPlayer(){ fill(255, 0, 0); rect(mouseX, mouseY, 30, 30); }

このように変更してください。

function draw() { background(0); drawRoads(); drawPlayer(); } function drawRoads() { fill(255); rect(200, 200, 150, 20); } function drawPlayer(){ fill(255, 0, 0); rect(mouseX, mouseY, 30, 30); }

ゲームを起動してみましょう。 画面真ん中に、白い四角形が表示されたと思います。

コース1

コードを解説していきます。

まず、新しい関数drawRoads を定義しました。

function drawRoads() { fill(255); rect(200, 200, 150, 20); }

プレイヤーの表示と同じように、四角形を描画しています。
fill(255); は白で塗りつぶすことを意味しています。

次に、 draw 関数内で呼び出すことで、 drawRoads 関数を実行しています。

次のレッスンでは、四角形を複数作って、コースを作っていきます!

オンライン相談

つまづいたときは

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

はじめに

コース一覧

ゲーム開発コース

数学コース

アートコース

入門コース

このサイトについて


© 2022 ルートアイ All rights reserved.