Tabla de contenido:

JeuTropFacile - WayTooEasyGame: 3 pasos
JeuTropFacile - WayTooEasyGame: 3 pasos

Video: JeuTropFacile - WayTooEasyGame: 3 pasos

Video: JeuTropFacile - WayTooEasyGame: 3 pasos
Video: Fix Your BAD Positioning (4 EASY Steps) 2024, Noviembre
Anonim
JeuTropFacile - WayTooEasyGame
JeuTropFacile - WayTooEasyGame

Este es un juego hecho completamente en HTML y JavaScript con la biblioteca P5js. Hay 2 archivos llamados index.html y sketch.js. Soy muy principiante en el código, así que lo siento si no está claro.

Puedes jugar el juego con este enlace

Controlas una bola blanca con las flechas y tienes que esquivar la bola roja (actualmente, solo hay una).

Creé 2 variables: posX = 200 y posY = 200

En sketch.js, creé un canva en la configuración de la función con 640x por 480y con un fondo gris en la función dibujar, luego creé un círculo blanco con la posición en posX, posY, 75, 75.

Paso 1: mover el círculo

Moviendo el círculo
Moviendo el círculo

Como dije antes, puede usar las teclas de flecha para mover el círculo.

Para hacer eso, creé una función updatePositionEllipse ().

Usé esta condición para que funcione: if (keyIsDown (DOWN_ARROW)) {

posY + = 5;

}

Cuando se presiona la tecla hacia abajo, el círculo se mueve hacia abajo.

Lo usé en todas las demás teclas para que puedas moverte hacia la izquierda, hacia la derecha, hacia arriba y hacia abajo.

Paso 2: creación de fronteras límite

Crear fronteras límite
Crear fronteras límite

Para hacer que la bola blanca se detenga al final del canva utilicé la función testOutOfScreen.

Dentro de él, usé la condición if (posX> 600) {

posX = 600; strokeWeight (6); trazo ('azul'); línea (637, 0, 637, 480); }

si la posición de x es superior a 600: bloquea el balón y traza una línea azul con un borde 6 colocado en el lado derecho de la canva.

Hago esto para todas las fronteras.

Recomendado: