Soy un principiante en p5.js y estaba tratando de hacer un juego de captura, donde las bolas caen del cielo y las atrapas con una canasta, pero cuando ejecutas el código, a veces las bolas no caen hasta esperar. unos segundos y moviendo la canasta, ¿alguien podría decirme por qué es esto?
Aquí está mi código:
let speed = 3; let x = 300; let y = 0; let score = 0; function setup() { createCanvas(600, 400); } function draw() { background(0); ellipse(x, y, 20, 20); y = y + speed; rect(mouseX, height - 10, 60, 40); fill(255); text("score = " + score, 30, 20); if (y > height - 10 && x > mouseX - 20 && x < mouseX + 20) { y = -20; speed += 1; score += 1; } if (y == -20) { x = random(width); } } function reset(){ score = 0; speed = 2; y = -20; }Tu lógica de juego parece un poco extraña:
Cada cuadro aumenta y por velocidad. Cada cuadro que verifica si el valor y ha pasado la posición de la paleta ( height - 10 ) y está dentro del área de la paleta (aunque las matemáticas para esto están un poco fuera de lugar). Sin embargo, no tienes ninguna condición para cuando la pelota se ha ido por el borde de la pantalla y no ha tocado la raqueta. Como resultado, nada sucede una vez que la pelota sale de la pantalla hasta que el jugador mueve la paleta a una posición en la que habría atrapado la pelota.
Aquí hay una versión fija:
let speed = 2; let x = 300; let y = 0; let score = 0; let coolDown = 0; function setup() { createCanvas(windowWidth, windowHeight); x = width / 2; } function draw() { if (coolDown > 0) { background('red'); } else { background(0); ellipse(x, y, 20, 20); y = y + speed; } rect(mouseX - 20, height - 10, 40, 10); fill(255); text("score = " + score, 30, 20); // After the player misses give them a second if (coolDown > 0) { coolDown--; return; } if (y > height - 10 && x > mouseX - 20 && x < mouseX + 20) { y = -20; speed += 0.5; score += 1; } else if (y > height) { // The ball is off screen coolDown = 30; y = -20; score -= 1; } if (y == -20) { x = random(width); } } function reset() { score = 0; speed = 2; y = -20; } html, body { margin: 0; padding: 0; } <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script> Otra cosa a tener en cuenta es que si mueve el mouse fuera de la ventana o iframe, entonces p5.js no actualizará las mouseX y mouseY . Para evitar que esto suceda, puede considerar el uso de requestPointerLock .