在p5.play中使用不可移动对象实现碰撞检测遇异常求助

核心问题原因 #

墙体随player移动的异常，本质是墙体的不可移动属性未正确生效，加上bounce方法的弹性碰撞逻辑，导致墙体被错误带动。

具体修复步骤 #

1. 确保墙体不可移动属性生效
   虽然给walls组设置了immovable = true，但更稳妥的方式是先设置组属性再添加Sprite，避免继承问题：

   walls = new Group();
   // 先设置组的不可移动属性，再添加墙体
   walls.immovable = true;
   
   wall1 = createSprite(width/2, 0, width, 10);
   wall2 = createSprite(0, height/2, 10, height);
   wall3 = createSprite(width/2, height, width, 10);
   wall4 = createSprite(width, height/2, 10, height);
   
   walls.add(wall1);
   walls.add(wall2);
   walls.add(wall3);
   walls.add(wall4);
   

2. 替换碰撞方法为collide
bounce会触发弹性碰撞的物理反馈，对于固定墙体，collide方法仅实现阻挡逻辑，不会产生带动或反弹：

   // 替换原代码中的player.bounce(walls)
   player.collide(walls);
   

3. 修复player移动逻辑，无按键时停止
   当前代码松开按键后player会持续移动，需在无按键时重置速度：

   function draw() {
     background(220);
     drawSprites();
     
     // 无按键时重置速度
     player.setSpeed(0);
     if (keyIsDown(LEFT_ARROW)) {
       player.setSpeed(10, 180);
     } else if (keyIsDown(RIGHT_ARROW)) {
       player.setSpeed(10, 0);
     } else if (keyIsDown(UP_ARROW)) {
       player.setSpeed(10, 270);
     } else if (keyIsDown(DOWN_ARROW)) {
       player.setSpeed(10, 90);
     }
   }
   

完整修复代码 #

let walls;
let ball, player, wall1, wall2, wall3, wall4;

function setup() {
  createCanvas(600, 600);
  
  ball = createSprite(300, 300, 20,20);
  ball.shapeColor = [0,0,0];
  
  player = createSprite(50, 300, 25, 75);
  player.shapeColor = [20, 200, 20];
  
  walls = new Group();
  walls.immovable = true;
  
  wall1 = createSprite(width/2, 0, width, 10);
  wall2 = createSprite(0, height/2, 10, height);
  wall3 = createSprite(width/2, height, width, 10);
  wall4 = createSprite(width, height/2, 10, height);
  
  walls.add(wall1);
  walls.add(wall2);
  walls.add(wall3);
  walls.add(wall4);
}

function draw() {
  background(220);
  drawSprites();
  
  player.setSpeed(0);
  if (keyIsDown(LEFT_ARROW)) {
    player.setSpeed(10, 180);
  } else if (keyIsDown(RIGHT_ARROW)) {
    player.setSpeed(10, 0);
  } else if (keyIsDown(UP_ARROW)) {
    player.setSpeed(10, 270);
  } else if (keyIsDown(DOWN_ARROW)) {
    player.setSpeed(10, 90);
  }
  
  player.bounce(ball);
  ball.collide(walls);
  player.collide(walls);
}

修复说明 #

• immovable属性确保墙体不受任何物理力影响，保持固定位置。
• collide方法针对固定障碍物场景，仅阻挡player移动，无多余物理交互。
• 重置速度的逻辑让player操作更符合直觉，松开按键后立即停止。

内容的提问来源于stack exchange，提问作者Leafeon 2431