背景を動かそう(p5.js)

今回は背景を動かします。

この画像は仮の背景画像です。
自分のゲーム作る際は素材を用意しましょう。

let bgImg;
let bgY = 0;

function preload() {
  // 背景画像を読み込む
  bgImg = loadImage('Talent Photo BG.png');
}

function setup() {
  createCanvas(400, 800);
}

function draw() {
  background(255);
  
  // 背景画像を描画し、スクロールさせる
  image(bgImg, 0, bgY, width, height);
  image(bgImg, 0, bgY - height, width, height);

  // 背景をした方向に移動
  bgY += 2; // 速度を変えたい場合はこの値を調整
  
  // 背景が画面の下端まで移動したらリセット
  if (bgY >= +height) {
    bgY = 0;
  }
}

これで背景画像が下方向にスクロールします。