Cómo agregar la gravedad para su juego html5

Video: 11.- Snake en HTML5 - Fin del juego

cálculos de gravedad han sido una parte de HTML5 videojuegos desde el principio. En realidad, hay dos tipos de gravedad a considerar. En los juegos de estilo plataforma, el jugador está cerca de un planeta, y toda la gravedad parece tirar todo recto hacia abajo.

Video: 11.- Curso Juego Plataformas en HTML5 - Aplicando gravedad

Cuando se sabe cómo añadir vectores de aceleración, la gravedad de estilo plataforma es realmente fácil trabajar con él. Pensar en la gravedad como una fuerza constante siempre tirando hacia abajo una pequeña cantidad cada cuadro.

Cómo agregar cohetes para el paseo de su juego

Este ejemplo tiene otra característica interesante. Cuando se pulsa la flecha hacia arriba, la imagen del coche se cambia a otra imagen con las llamas.

El código para el auto flotante ejemplo se muestra aquí en su totalidad:

hoverCar.html

Modo de empleo vector de fuerza en su juego

La gravedad es en realidad bastante sencillo. Es simplemente un vector de fuerza. Las otras partes interesantes de este ejemplo implican cambiar el movimiento horizontal sin cambiar el ángulo de la imagen del coche y ajustar la imagen para indicar el propulsor. Estos son los pasos:

Video: 11. Curso de Unity - Física: Definiendo la gravedad

  1. Construir dos imágenes diferentes.

    Use su editor de imágenes para construir dos versiones diferentes de la imagen.

  2. Construir un sprite de ordinario.

    Como la mayoría de los sprites de vehículos, se necesita una checkKeys () método. Éste está configurado en la forma ordinaria, pero el comportamiento es un poco diferente.

  3. Establecer la imagen por defecto.

    La imagen por defecto no tiene propulsores. Utilizar el cambiar imagen() método para hacer esto la imagen predeterminada. Cuando los propulsores están encendidos, la imagen se puede cambiar.

  4. Utilizar una variable para controlar la velocidad horizontal.

    Puede crear el hspeed variable para controlar la velocidad horizontal del coche.

  5. Establecer las flechas izquierda y derecha para modificar hspeed.

    Las teclas de flecha izquierda y derecha modifican la hspeed variable.

  6. Utilizar changeXby para ajustar la velocidad horizontal.

    Después de comprobar todas las llaves, cambie el x valor del coche con el valor actual de hspeed.

  7. La flecha hacia arriba añade un vector hacia arriba.

    Utilice el ahora infame addVector () función para añadir un pequeño vector de fuerza hacia arriba cuando el usuario pulsa la flecha hacia arriba. Recuerde que 0 grados es hacia arriba. Juega un poco con este valor para obtener la cantidad de empuje que desea para su juego.

  8. Mostrar los propulsores cuando se pulsa la flecha hacia arriba.

    Si el usuario está presionando la flecha hacia arriba, lo que necesita para mostrar los propulsores. Utilizar el cambiar imagen() Método para ajustar la imagen del sprite para el que tiene propulsores de cohetes.

  9. Construir un checkGravity () método.

    Este método será llamado cada fotograma para compensar la gravedad.

  10. Comprobar para ver si se encuentra en el suelo.

    Video: Programacion Web #5 Como poner una Cancion en HTML5 [HTML5, CSS, javascript]

    En este ejemplo, el suelo se define como una y valor mayor que 580.

  11. Si no está en el suelo, añadir un vector de fuerza de la gravedad.

    Debido a que se acumulará, el vector de la fuerza de gravedad tiene que ser bastante pequeña. Que necesita para equilibrar la fuerza de la gravedad y los propulsores para obtener el comportamiento que desea. Si la gravedad es demasiado fuerte, los propulsores no funcionan. Si propulsores son demasiado fuertes, el coche simplemente vuela en el espacio.

Artículos Relacionados