マリオみたいなゲームを作ろうその1(p5.js)

p5.js

今回からマリオみたいなアクションゲームを作ります。
playerの中身はx,y,w,hはプレイヤーの描写に使います。
vyはジャンプする値。
isJumpingはジャンプフラグです。

let player;

function setup() {
  createCanvas(800, 400);
  player = { x: 50, y: 300, w: 40, h: 40, vy: 0, isJumping: false };
}

function draw() {
  background(135, 206, 250); // 空の色
  fill(50, 200, 50); // 地面の色
  rect(0, height - 50, width, 50); // 地面
  
  // プレイヤーの描画
  fill(255, 0, 0);
  rect(player.x, player.y, player.w, player.h);
  
  // プレイヤーの重力処理
  player.vy += 1; // 重力
  player.y += player.vy;

  // 地面との衝突判定
  if (player.y + player.h >= height - 50) {
    player.y = height - 50 - player.h;
    player.vy = 0;
    player.isJumping = false;
  }
  
  if (keyIsDown(LEFT_ARROW)) {
      player.x -= 5;
    }

    // 右の矢印キーが押されている場合
    if (keyIsDown(RIGHT_ARROW)) {
      player.x += 5;
    }
}
function keyPressed() {
  if (keyCode === 32 && !player.isJumping) { // スペースキー
    player.vy = -15;
    player.isJumping = true;
  }
}

コメント


タイトルとURLをコピーしました