Curso y Libro Flame: Desarrollo de juegos en 2D con Flutter y Dart

Curso para dar los primeros pasos en la creación de juegos en 2D multiplataforma usando Flutter con Flame, aprender a animar sprite mediante saltos, caminar y mucho más.

24-01-2023 - Andrés Cruz

• Categoría
• /
• Flutter
• /
• Curso y Libro Flame: Desarrollo de juegos en 2D con Flutter y Dart

Por aquí tienes el listado completo de clases que vamos a cubrir en el libro y curso:

Introducción

• 1 introducción

• 2 Como ver el curso

Crear un proyecto

• 1 Crear un proyecto

  Vamos a crear un proyecto en Flutter y agregar Flame.

Bases - Primeros pasos - Flame 1.7V

• 1 Introducción

• 2 Clase FlameGame: Ejemplo Sprite

  Vamos a mostrar un sprite/imagen en Flutter con Flame.

• 3 Clase FlameGame: Ejemplo Canvas, círculo

  Vamos a mostrar un circulo en Flutter con Flame.

• 4 Reto: Clase FlameGame: Ejemplo Canvas, rectángulo

  Vamos a mostrar un rectángulo en Flutter con Flame.

• 5 Clase Game: Ejemplo Canvas, círculo

  Vamos a mostrar un circulo en Flutter con Flame.

• 6 Clase Game/FlameGame: función update

  Vamos a conocer el uso básico de la función de update.

• 7 SpriteComponent: Una sola imagen/sprite

  Vamos a mostrar una imagen mediante un componente.

• 8 SpriteComponent: Actualizar posición

  Vamos a modificar la posición de un sprite.

• 9 Entradas: Teclado, FlameGame

  Conoceremos cómo usar el teclado para la clase FlameGame.

• 10 Entradas: Teclado, Componente

  Conoceremos cómo usar el teclado a nivel de componente.

• 11 Reto: Mover sprite al pulsar flechas de direcciones

  Vas a realizar el movimiento del sprite mediante las teclas asdw y flechas.

• 12 SpriteComponent: Conseguir sprites para tu juego

  Vamos a conseguir imágenes para el juego.

• 13 SpriteComponent: Texturepacker

  Vamos a aprender a generar nuestros sprite sheets.

• 14 SpriteComponent: Cargar un sprite sheet

  Vamos a cargar un sprite sheet en la aplicación de Flutter.

• 15 SpriteAnimationComponent: Puntos claves

  Vamos a hablar de los factores claves para generar un listado animado de sprites en base a posiciones.

• 16 SpriteAnimationComponent: Pruebas

  Vamos a crear la función para generar un sprite animado.

• 17 SpriteAnimationComponent: Pruebas

  Vamos a realizar algunas pruebas con la función anterior cargando una animación.

• 18 SpriteAnimationComponent: Resto de animaciones

  Vamos a definir el resto de las animaciones que se encuentran disponibles en el sprite sheet.

• 19 SpriteAnimationComponent: Resto de animaciones

  Vamos a trabajar con el evento tap a nivel de la clase tipo Game.

• 20 Entradas: Tap, Componente

  Vamos a trabajar con el evento tap a nivel del componente.

• 21 Reto: SpriteAnimationComponent: Cambiar animación por tap

  Vas a realizar un cambio de animación cada vez que se realice un toque en la pantalla.

• 22 Reto: Animaciones y entradas (teclado): animación de caminar y reposo

  Vas a implementar el movimiento en el eje de las X y varias la animación en consideración.

• 23 Flip o mirror del sprite (y ancho propiedad)

• 24 Velocidad constante

  Vamos a implementar la velocidad constante usando el dt al momento de desplazarse.

• 25 Combinación de teclas

  Vamos a combinar teclas para correr.

• 26 PositionComponent: Dibujar un círculo con hitbox

  Vamos a dibujar un círculo mediante un PositionComponent.

• 27 Reto: PositionComponent: Mover círculo en el eje X

  Vamos a mover el círculo a un extremo.

• 28 Detectar colisiones: ScreenHitbox

  Vamos a conocer cómo manejar las colisiones entre el círculo y los extremos de la pantalla.

• 29 Colisiones y PositionComponent: Invertir dirección

  Vamos a invertir la dirección de desplazamiento del círculo al colisionar con los bordes de la pantalla.

• 30 Reto: Colisiones entre círculos

  Como reto, debes de al menos analizar cómo podemos colisionar entre figuras y aplicar alguna lógica.

• 31 Contador para las colisiones

  Vamos a colocar un contador de colisiones.

• 32 Colisiones en los sprites y modo debug

  Conoceremos como usar las colisiones en los sprite.

• 33 Publicar en github

Juego 1, Lluvia de meteoros - Flame 1.7V

• 1 Introducción

• 2 Versión de Flame recomendada V1.7.3

• 3 Proyecto en código base

  Vamos a crear un nuevo proyecto y presentar la estructura base del nuevo proyecto.

• 4 Generar círculos de colisión/hitbox por tiempo

  Vamos a generar círculos cada cierto tiempo generados de manera aleatoria.

• 5 Limitar que el player salga de pantalla

  Vamos a evitar que el player se salga de la pantalla.

• 6 Player: Variar animación al detectar borde

  Vamos a cambiar la animación cuando el player entra en contacto con el borde de la pantalla.

• 7 Generar contenedor (círculo de colisión) para la colisión

  Vamos a ajustar el ángulo de los círculos al generar los mismos.

• 8 Player: Implementar gravedad

  Vamos a implementar un sencillo esquema de gravedad sobre el player.

• 9 Remover componentes no visibles (círculos de colisión)

  Vamos a remover los círculos de colisión cuando ya no sean visibles.

• 10 Player: Implementar salto

  Vamos a implementar la habilidad de salto usando la gravedad para el carácter.

• 11 Modularizar clase player

  Vamos a crear una clase con las primitivas que luego vamos a sobrescribir.

• 12 Sprite animado de meteorito

  Vamos a convertir los círculos en meteoritos animados.

• 13 Contador de impactos

  Vamos a generar un contador para las colisiones.

• 14 Publicar en github

Background en color e imagen - Flame 1.7V

• 1 Introducción

  Introducción

• 2 Color de fondo: Función

  Vamos a aprender a cambiar el color de fondo de la ventana.

• 3 Color de fondo: Clase

  Vamos a aprender a cambiar el color de fondo de la ventana.

• 4 Imagen de fondo

  Vamos a establecer una imagen de fondo mediante una clase aparte.

• 5 Pruebas con distintos tamaños de la imagen del fondo, parte 1

  Vamos a realizar algunas pruebas variando el tamaño de fondo del componente.

• 6 Pruebas con distintos tamaños de la imagen del fondo, parte 2

  Vamos a conocer como se carga un componente y escuchar cuando él mismo ha sido cargado; aparte de, consultar sus propiedades.

• 7 Actualizar componente player con las dimensiones del mapa

  Vamos a actualizar el juego para que no pueda escapar por los bordes impuestos por el fondo y no por la ventana.

• 8 Establecer la cámara que siga al componente

  Vamos a aprender a mover la cámara en base a la posición del player.

• 9 Actualizar componente meteor con las dimensiones del mapa

  Vamos a adaptar el componente de meteorito para que se adapte a la posición de la cámara y tamaño de la ventana.

• 10 Publicar en github

Background tiled - Flame 1.7V

• 1 Introducción

• 2 Editores, tileset y tiles

  Vamos a introducir algunos conceptos claves y herramientas a utilizar.

• 3 Tiled Map Editor, primeros pasos

  Vamos a crear un mapa con Tiled Map Editor.

• 4 Flame tiled y bases del juego

  Vamos a crear la estructura de un proyecto base en Flutter Flame.

• 5 Cargar mapa tile

  Vamos a cargar el mapa anterior en un nuevo proyecto en Flutter con Flame.

• 6 Iterar capa object y definir un PositionComponent

  Con la capa de objetos definida antes, vamos a usarla para crear PositionComponent.

• 7 Detectar piso y gravedad

  Vamos a realizar algunos cambios en el código fuente de la app para adaptarlo al mapa tile.

• 8 Publicar en github

Juego 2, Saltar entre tiles - Flame 1.7V

• 1 Introducción

• 2 Detectar player en el aire

  Vamos a realizar algunas adaptaciones para detectar cuando el player esta saltando.

• 3 Cambios en el componente de salto y desplazamiento

  Vamos a realizar modificaciones adicionales para modificar el desplazamiento y adaptar el salto.

• 4 Animación de salto en un loop

  Vamos a modificar la animación de salto para que no se mantenga en un loop.

• 5 Desplazamiento en los tiles

  Vamos a realizar algunas pruebas para el desplazamiento del player con los tiles y el componente de hitbox del player.

• 6 Desplazamiento horizontal con el vector de velocidad

  Vamos a actualizar el mecanismo de desplazamiento horizontal del player al del vector de velocidad.

• 7 Crear varios componentes de hitbox para el player

  Vamos a crear componentes individuales de hitbox para el player.

• 8 Agregar el componente de meteorito

  Vamos a agregar el componente de meteorito en el juego.

• 9 Posición del player

  Vamos a cambiar la inicialización de la posición del player.

• 10 Modificar desplazamiento: X

  Vamos a actualizar el esquema creado para realizar el desplazamiento.

• 11 Modificar desplazamiento: Y

  Vamos a actualizar el esquema creado para realizar el desplazamiento.

• 12 Nuevo mapa y activar cámara

• 13 Overlay: Primeros pasos

  Vamos a presentar el uso de los overlays para superponer widgets.

• 14 Overlay: Game over

  Vamos a crear el overlay para el game over.

• 15 Instancia game en componentes y overlay

  Vamos a mostrar la comunicación entre los componentes y el overlay.

• 16 Instancia game en overlays y comunicación con los componentes

  Vamos a mostrar la comunicación entre los overlays y los componentes.

• 17 Funciones del overlay

  Vamos a conocer algunas funciones claves para usar los overlays.

• 18 Corregir contador de colisiones

  Vamos a conocer el problema del conteo con las colisiones entre el player y los meteoritos.

• 19 Tipos de colisiones

  Vamos a conocer los tipos de colisiones y cómo adaptarlo al juego.

• 20 Reset del player

  Vamos a crear una función para reiniciar parámetros del player.

• 21 Overlay: Contador de vidas

  Vamos a crear un contador de vidas en el overlay.

• 22 Reiniciar nivel al acabarse las vidas

  Vamos a reiniciar el nivel al detectar que el player quedó sin vida.

• 23 Pausa

  Vamos a implementar la función de pausar el juego.

• 24 Reiniciar nivel

  Vamos a colocar un botón para reiniciar el nivel.

• 25 Actualizar posición con deltatime

  Vamos a modificar la implementación del movimiento para que la actualización de la propiedad de position se realice solo en la función de update.

• 26 Bloquear movimiento del player por tiempo

  Vamos a crear una función para bloquear los movimientos del player.

• 27 Invencibilidad

  Vamos a crear una función para volver al player como invencible.

• 28 Consumibles en el mapa

  Vamos a modificar el mapa, para colocar algunos consumibles.

• 29 Consumibles en el mapa: Definir Sprite y registrar en la aplicación

  Vamos a implementar el consumo de items.

• 30 Consumibles en el mapa: Colocar en el mapa

  Vamos a pintar los consumibles en el mapa.

• 31 Consumibles en el mapa: Implementar lógica para ganar una vida

  Vamos a implementar la lógica para ganar una vida.

• 32 Consumibles en el mapa: Recargar en el reload

  Al momento de hacer el reload del juego, debemos de recargar los consumibles.

• 33 Consumibles en el mapa: Sobrescribir

  Vamos a solventar el problema que dejamos de antes al momento de sobrescribir los consumibles.

• 34 Consumibles en el mapa: Implementar lógica para el resto

  Vamos a implementar la lógica para la invencibilidad del usuario y de ganar.

• 35 Colocar parámetros extras a la función de reset

  Vamos a realizar algunos cambios en la función de reiniciar el juego.

• 36 Publicar en github

Opcional: Juego 2, experimentos varios - Flame 1.7V

• 1 Introducción

• 2 Variar el salto

• 3 Tamaño del mapa y movimiento del player

  Vamos a bloquear los movimientos del player fuera del entorno del mapa.

• 4 Imagen de fondo

  Vamos a colocar una imagen de fondo.

• 5 Desnivel entre el posicionamiento del player y los tiles

  Vamos a corregir el problema de que el player puede quedar desnivelado al pisar los tiles.

• 6 Evitar que el player caiga a una velocidad muy elevada

  Vamos a usar la función de clamp para controlar la velocidad de caída del player.

• 7 Fórmulas matemáticas básicas: Presentación

  Hablaremos sobre el siguiente desarrollo a llevar a cabo.

• 8 Fórmulas matemáticas: hitbox player

  Calculamos otro hitbox para el player y removemos el de foot.

• 9 Fórmulas matemáticas: Implementación

  Comenzamos implementando los nuevos cambios.

• 10 Fórmulas matemáticas: Detalles finales

  Vamos a terminar la implementación anterior.

• 11 Fórmulas matemáticas: Centros de las colisiones

  Explicamos el detalle de los centros de colisión.

• 12 Fórmulas matemáticas: Normal de la colisión

  Explicamos cómo calcular la normal de la colisión.

• 13 Fórmulas matemáticas: Magnitud

  Explicamos cómo calculamos la separación entre colisiones.

• 14 Producto escalar

  Explicamos cómo calculamos el producto escalar.

• 15 Adaptar a pantallas pequeñas

• 16 Publicar en github

Juego 2, Updates Flame - Flame 1.7V - 1.8.1V

• 1 Flame 1.81 Animación Ticker

• 2 cameraComponent

Juego 3, desplazar XY

• 1 Introducción

• 2 Estructura base

  Crearemos los archivos y configuración base para el proyecto.

• 3 Animaciones de movimiento

  Vamos a crear las animaciones del player.

• 4 Movimiento

  Vamos a implementar el movimiento del player al presionar las teclas.

• 5 Demo: Movimiento, isMoving

  Vamos a mostrar otra implementación para el movimiento.

• 6 Cambios en el movimiento y animación

  Vamos a solventar el problema de cuando dejamos de desplazarnos el player apunta siempre hacia la misma dirección.

• 7 Crear mapa

  Crearemos el mapa para nuestro juego.

• 8 Importar y usar mapa en el proyecto

  Vamos a utilizar el mapa anterior en el proyecto.

• 9 Componentes para los obstáculos

  Vamos a definir el apartado de los objetos en el mapa para que puedan ser colisionables.

• 10 Cámara

  Vamos a usar definir que la cámara siga al player y definir límites.

• 11 Colisiones player obstáculos, estructura y pruebas iniciales

  Vamos a implementar la lógica para las colisiones iniciales.

• 12 Colisiones player obstáculos, otras pruebas

  Vamos a ver otra implementación para manejar las colisiones.

• 13 Colisiones player obstáculos, implementación final

  Vamos a conocer la implementación final.

• 14 Colisiones player obstáculos, variante

  Vamos a conocer otra variante del esquema anterior, en la cual, prescindimos de una propiedad.

• 15 Colisiones player obstáculos, doble colisión

  Vamos a trabajar en la colisión doble.

• 16 Límites de la pantalla para el player

  Vamos a definir los límites de la pantalla con el player.

• 17 Definir posición del player

  Vamos a colocar el player en su posición en base a lo establecido en el mapa.

• 18 Tamaño hitbox

  Vamos a variar el tamaño del hitbox del player.

• 19 Correr

  Vamos a implementar la función de correr.

• 20 Publicar en github

Juego 3, Enemigos

• 1 Introducción

• 2 Clase base

  Crearemos la clase base para los enemigos con la función de cambio de posición.

• 3 Clase zombie

  Crearemos una clase para crear un enemigo en pantalla.

• 4 Actualizar sprite

  Vamos a cambiar el sprite del enemigo por un zombie.

• 5 Colisiones entre objetos y límites para del mapa

  Vamos a tratar el problema que el player escapa del mapa y cae al vacío.

• 6 Manejar múltiples enemigos: Listado de enemigos por mapa

  Vamos a crear el archivo en el cual, mantendremos el tipo de movimiento, el patrón y la cantidad de enemigos.

• 7 Manejar múltiples enemigos: Mover al player en base a patrones

  Vamos a implementar la función para mover al enemigo por patrones.

• 8 Manejar múltiples enemigos: Terminar y probar

  Vamos a terminar las implementaciones anteriores y probar.

• 9 Capa de enemigos en el mapa

  Vamos a crear la capa de enemigos en el mapa.

• 10 Clase esqueleto

  Crearemos la capa de esqueleto.

• 11 Capa de objeto para los enemigos

  Vamos a usar la capa de enemigos del mapa.

• 12 Publicar en github

Juego 4, Plantas vs Zombies

• 1 Introducción

• 2 Sobre el proyecto

  Hablaremos sobre el proyecto.

• 3 Importar sprite iniciales de plantas

  Vamos a conocer cuales son las imágenes iniciales vamos a usar.

• 4 Crear un componente de planta, Base

  Vamos a crear la clase base para las plantas.

• 5 Crear un componente de planta, Peashooter

  Vamos a crear la estructura para la primera planta.

• 6 Reto, Crear un componente de planta, Cactus

  Vamos a crear la estructura para la segunda planta.

• 7 FlameGame: Agregar una planta por toque

  Vamos a agregar una planta por un toque.

• 8 Mapa: Diseñar

  Vamos a diseñar el mapa para nuestro juego.

• 9 Mapa: Cargar

  Vamos a cargar el mapa en el componente.

• 10 Componente: Agregar una planta por toque, parte1

  Vamos a realizar los cambios necesarios para manejar dado un tap en el componente de seed, agregar una planta desde FlameGame.

• 11 Componente: Agregar una planta por toque, parte2

  Vamos a agregar una planta desde SeedComponent dado un click.

• 12 Agregar una planta alineada en el SeedComponent

  Vamos a alinear las plantas agregadas en base a la posición del SeedComponent.

• 13 Escalar planta al tamaño del seed

  Vamos a escalar el tamaño de las plantas para que ocupe el tamaño del SeedComponent.

• 14 Evitar agregar varias plantas en un mismo lugar

• 15 Crear un componente de zombie, Base

  Crearemos la clase para definir el zombie.

• 16 Crear un componente de zombie, Cono

  Crearemos un componente tipo zombie para agregar en el mapa.

• 17 Reto, Crear un componente de zombie, Puerta

  Crearas otro componente de zombie.

• 18 Manejo del nivel

  Vamos a realizar la lógica para definir los zombies por niveles.

• 19 Agregar un zombie cada cierto tiempo

  Vamos a realizar la lógica para agregar zombies en el mapa.

• 20 Crear canales

  Vamos a crear la lógica para saber si un canal está ocupado o no.

• 21 Variar animación de las plantas a modo ataque

  Vamos a colocar la animación de las plantas en modo ataque al detectar un zombie en el canal.

• 22 Proyectil: Crear estructura

  Vamos a crear las bases para crear el proyectil para la planta.

• 23 Proyectil: Disparar

  Vamos a realizar la implementación para disparar.

• 24 Proyectil: Posición inicial

  Vamos a variar la posición inicial de la planta.

• 25 Vida y colisiones

  Vamos a definir las propiedades de vida y daño en los componentes de zombies y plantas.

• 26 La planta ataca a los zombies

  Vamos a realizar la implementación en la cual, la planta ataca al zombie mediante el proyectil.

• 27 Detener al zombie en contacto con las plantas

  Vamos a detener al zombie apenas esté en contacto con la planta para que luego inicie el ataque.

• 28 El zombie ataca a las plantas

  Vamos a realizar la implementación en la cual, el zombie ataca a la planta.

• 29 Variar animación del zombie en el modo ataque y al estar herido

  Vamos a crear un par de animaciones más para mostrar otros estados del zombie.

• 30 Cambiar tamaño del hitbox del zombie

  Vamos a modificar el hitbox del zombie para que no ocupe dos canales.

• 31 No colocar planta en espacio ocupado por un zombie

  Vamos a bloquear el espacio ocupado por un zombie para no poder sembrar en ella.

• 32 Drag, Implementar el componente de cámara y world

  Vamos a habilitar el componente de cámara y mundo al juego.

• 33 Drag, Crear un nuevo componente para el evento Drag

  Vamos a crear el componente para implementar el evento drag.

• 34 Drag, Implementar el evento Drag

  Vamos a implementar el evento drag.

• 35 Drag, Desplazar la cámara

  Vamos a implementar el drag de la cámara.

• 36 Agregar plantas y zombies al world

  Vamos a agregar las plantas y zombies al mundo.

• 37 Escalar componentes al tamaño de la ventana: Presentación

  Vamos a dar una implementación del desarrollo que vamos a realizar.

• 38 Escalar componentes al tamaño de la ventana: Calcular factor

  Vamos a calcular el factor de reescalado.

• 39 Escalar componentes al tamaño de la ventana: Fondo

  Vamos a acomodar el escalado con el fondo y los soles.

• 40 Escalar componentes al tamaño de la ventana: Seeds

  Vamos a acomodar el escalado con el seed.

• 41 Escalar componentes al tamaño de la ventana: Plantas

  Vamos a acomodar el escalado con las plantas.

• 42 Escalar componentes al tamaño de la ventana: Zombies

  Vamos a acomodar el escalado con los zombies.

• 43 Detalles finales

• 44 Publicar en github

Juego 4, experimentos varios

• 1 Introduccion

• 2 Overlay: Plantas

  Vamos a crear el overlay para mostrar las plantas seleccionables.

• 3 Overlay: Plantas, Seleccionar

  Vamos a crear la lógica para mostrar una planta seleccionada.

• 4 Overlay: Plantas, Marcar planta seleccionada

  Vamos a mostrar un borde para la imagen seleccionada.

• 5 Componente de soles

  Vamos a crear el componente para manejar los soles.

• 6 Desplazar soles onduladamente

  Vamos a variar el movimiento de las plantas en el eje de las X para que sea ondulado.

• 7 Contador de soles

  Vamos a crear un contador para los soles.

• 8 Overlay: Soles

  Vamos a crear un overlay para los soles.

• 9 Costo por plantas

  Vamos a realizar el descuento por el costo de las plantas al agregarlas en el campo.

• 10 Transparencia en el overlay de plantas

  Vamos a agregar un detalle visual a las plantas en el overlay para cuando no existan soles, colocar una opacidad a la planta.

• 11 Generar soles en el espacio del mapa

  Vamos a generar los soles en el espacio del mapa.

• 12 Recarga de las plantas: Configuración base

  Vamos a crear el contador con un container que se superponga a las plantas en el overlay para poder agregar plantas cuando se cumpla un tiempo desde la última interacción.

• 13 Recarga de las plantas: Reutilizar el widget de la animación

  amos a crear un widget reutilizable para el desarrollo anterior.

• 14 Mostrar animación al agregar la planta en el mapa

  Vamos a mostrar la animación del overlay al momento de agregar la planta en el mapa.

• 15 Reto: Evitar agregar una planta cuando hay una animación en progreso

  Vamos a bloquear el acceso a las plantas al momento de que inicie la animación.

• 16 Extra: Corregir sprite sheets, zombie cono, primera parte

  Vamos a corregir una de las imágenes del juego.

• 17 Extra: Corregir sprite sheets, zombie cono, segunda parte

  Vamos a corregir una de las imágenes del juego.

• 18 Bloquear planta individualmente

  Al agregar una planta se bloquean todas las plantas, vamos a hacer este bloqueo de manera individual.

• 19 Personalizar tiempo de bloqueo de las plantas

  Vamos a colocar que la duración de carga para cada planta es individual y personalizable.

• 20 Reubicar widgets del borde de las plantas en el overlay

  Vamos a acomodar los bordes de la planta para que el overlay se ajuste correctamente si está o seleccionada.

• 21 Pausa

  Implementaremos la opción de pausar el juego.

• 22 Reset

  Implementaremos la opción de reiniciar el juego.

• 23 Evento Drag, Presentación

  Veremos una presentación del evento Drag que será necesario para poder desplazar la cámara.

• 24 Publicar en github

Fondos parallax

• 1 Introducción

• 2 Crear proyecto

  Vamos a crear el proyecto en Flame.

• 3 Importar images parallax

  Vamos a descargar e instalar las capas para el fondo parallax en el proyecto. https://craftpix.net/freebies/free-cartoon-parallax-2d-backgrounds/

• 4 Crear el efecto parallax: Superponer fondos

  Vamos a crear un componente para superponer los fondos.

• 5 Crear el efecto parallax: Desplazar fondos, baseVelocity

  Vamos a conocer cómo desplazar las capas del parallax.

• 6 Crear el efecto parallax: Desplazar fondos a diferentes velocidades, velocityMultiplierDelta

  Vamos a conocer cómo desplazar cada capa a velocidades distintas y lograr la sensación de profundidad y con esto, el efecto parallax.

• 7 Crear una clase componente para el parallax

  Crearemos ahora un componente aparte en un archivo para el fondo parallax.

• 8 Player: Estructura base

  Crearemos la clase base para el player. https://www.deviantart.com/ottojoy/art/Shark-Sprites-434969176

• 9 Player: Definir animaciones

  Crearemos la animación del player en base al sprite sheet.

• 10 Player: Hitbox

  Crearemos el hitbox base para el player.

• 11 Player: Desplazamiento

  Implementamos en movimiento hacia los lados y arriba/abajo para el player.

• 12 Player: Rotación, primeros pasos

  Vamos a implementar que el player rota 90 grados por vez al presionar la tecla R.

• 13 Player: Rotación, flipVertically

  Vamos a hacer el flip vertical en la rotación a la derecha/izquierda.

• 14 Generar dulces: Fundamentos

  Hablaremos sobre la importancia de tener una estructura sólida, limpia y escalable para desarrollar las distintas funcionalidades del juego.

• 15 Generar dulces: Ideas iniciales

  Presentaremos parte de la solución a llevar a cabo para la creación de dulces en cualquiera de los lados de la pantalla.

• 16 Generar archivo ayuda food, primera parte

  Vamos a implementar la primera parte del archivo de ayuda para construir un alimento por pantalla.

• 17 Generar archivo ayuda food, primera parte

  Vamos a implementar la primera parte del archivo de ayuda para construir un alimento por pantalla.

• 18 Generar dulces: Sobre el componente

  Explicamos de manera básica el componente de alimento.

• 19 Generar dulces: Componente de alimento, estructura base

  Empezamos a crear las bases del componente de alimento.

• 20 Generar dulces: Componente de alimento, calcular posición

  Calcularemos la posición de incidencia del dulce.

• 21 Generar dulces: Componente de alimento, generar

  Vamos a definir la lógica para agregar los dulces en el main.

• 22 Generar dulces: Componente de alimento, remover

  Vamos a remover los dulces que no sean visibles en la pantalla.

• 23 Generar dulces: Componente de alimento, límites en la posición

  Vamos a verificar unas cotas máximas al momento de generar las posiciones.

• 24 Consumir alimentos: Hitbox

  Vamos a crear el hitbox para la boca del player.

• 25 Consumir alimentos: Colisión

  Vamos a detectar la colisión entre la boca y el alimento.

• 26 Consumir alimentos: Reproducir animación de masticando

  Vamos a reproducir la animación de masticando por un tiempo determinado especificado en el alimento.

• 27 Consumir alimentos: No consumir alimentos mientras mastica

  Vamos a colocar una regla adicional en la cual el player no pueda consumir alimentos mientras mastica.

• 28 Consumir alimentos: Consumir los alimentos en una posición

  Vamos a colocar una regla adicional en la cual el player solamente pueda consumir alimentos en el mismo ángulo del alimento.

• 29 Estadísticas: Propiedad adicional para el puntaje

  Vamos a crear una propiedad adicional para manejar el puntaje personalizado para cada dulce.

• 30 Estadísticas: Propiedades y lógica

  Vamos a implementar las propiedades para manejar las estadísticas y la lógica para actualizarlas.

• 31 Estadísticas: Overlay

  Creamos el overlay para las estadísticas.

• 32 Implementar bases para las formas de jugabilidad

  Vamos a implementar las bases (los métodos y sus parámetros) para los tipos de juegos.

• 33 Implementar bases para las formas de jugabilidad

  Vamos a implementar las bases (los métodos y sus parámetros) para los tipos de juegos.

• 34 Jugabilidad 1: Al perder un dulce

  Implementamos la primera jugabilidad, si el player pierde un dulce, pierde.

• 35 Jugabilidad 2: Conseguir un mínimo de puntos

  Implementamos la segunda jugabilidad, en la cual el player tiene que conseguir una cantidad determinada de puntos.

• 36 Jugabilidad 3: Solo consumir un tipo de dulce

  Implementamos la tercera jugabilidad, en la cual el player solo puede consumir un tipo de dulce.

• 37 Jugabilidad 4: No consumir un tipo de dulce

  Implementamos la cuarta jugabilidad, en la cual el player no puede consumir un tipo de dulce.

• 38 Jugabilidad: Dulce consumido o perdido

  Vamos a implementar un argumento adicional para verificar si el dulce fue consumido o perdido.

• 39 Probar implementaciones: Estructura base

  Vamos a crear la estructura para probar la implementación anterior.

• 40 Probar implementaciones: Jugabilidad 1

  Probaremos la 1 implementación.

• 41 Probar implementaciones: Jugabilidad 2

  Probaremos la 2 implementación.

• 42 Cambio en las estadísticas

  Aplicaremos algunos cambios en la estructura de la aplicación.

• 43 Probar implementaciones: Jugabilidad 3

  Probaremos la 3 implementación.

• 44 Probar implementaciones: Jugabilidad 4

  Probaremos la 4 implementación.

• 45 Definir múltiples niveles

  Vamos a crear una función para manejar todos los niveles del juego.

• 46 Función para hacer cargar niveles del juego

  Vamos a crear una función para cargar los niveles y hacer el reset.

• 47 Overlay: Fin de juego, implementar

  Vamos a crear el overlay para el fin de juego.

• 48 Overlay: Fin de juego, mostrar

  Vamos a mostrar el overlay anterior en base a algunas acciones.

• 49 Overlay: Acciones del juego

  Vamos a implementar las acciones del jueogo, pausar y reiniciar.

• 50 Overlay: Seleccionar niveles

  Crearemos el overlay para seleccionar niveles.

• 51 Overlay: Seleccionar la jugabilidad

  Crearemos el overlay para seleccionar la jugabilidad.

• 52 Mostrar información del tipo de juego y nivel en pantalla

  Vamos a mostrar el nivel y tipo de juego en el overlay de estadísticas.

• 53 Mostrar información del tipo de juego y nivel en pantalla

  Vamos a mostrar el nivel y tipo de juego en el overlay de estadísticas.

• 54 GameOver: Implementar tipos de juego

  Vamos a implementar desde la función de GameOver evaluar la lógica según el tipo de juego seleccionado.

• 55 Siguiente nivel

  Implementamos la lógica para ir al siguiente nivel.

• 56 Publicar en Github

Juego 5, Hud: Joystick y botón entre otros

• 1 Introducción

• 2 Hud: Presentación

  Hablaremos sobre los huds a desarrollar en esta sección y daremos una demostración.

• 3 Hud: joystick, definición

  Vamos a implementar el joystick.

• 4 Hud: joystick, movilidad

  Vamos a implementar la movilidad del player mediante el joystick.

• 5 Hud: Botón para rotar al player, definición

  Vamos a implementar un botón para ser usado en la pantalla táctil o mediante un ratón.

• 6 Hud: Botón para rotar al player, rotación

  Vamos a implementar la rotación mediante el botón virtual.

• 7 Shared Preferences, prevalecer estado del juego

  Vamos a guardar de manera persistente el nivel y tipo de juego y que se cargue el último estado al abrir la aplicación.

• 8 Eliminar las instancias de alimentos al reiniciar

  Vamos a eliminar las instancias de los alimentos al hacer el reset.

• 9 Adaptar a pantallas pequeñas

  Vamos a hablar sobre posibles cambios que puedes realizar para adaptar el juego a pantallas de pequeñas dimensiones.

• 10 Sobre el uso del GamePad

  Hablamos sobre el paquete que vamos a utilizar.

• 11 gamepads: Pruebas

  Vamos a realizar algunas pruebas con el paquete de gamepads.

• 12 Implementar el uso del GamePad

  Vamos a implementar las reglas para que podamos emplear el gamepad en el juego.

• 13 Publicar Github

Audio: Todos los proyectos

• 1 Audio experimental

• 2 FlameAudio, primeros pasos

  Presentaremos el uso del paquete con el cual, podemos manejar los audios en Flame.

• 3 Juego 2 - Dino Jump: Sonido de Fondo

  Definimos el sonido de fondo.

• 4 Juego 2 - Dino Jump: Sonido por acciones

  Definimos el sonido para las acciones.

• 5 Juego 2 - Dino Jump: Sonido en bucle demo 1

  Vamos a conocer cómo reproducir sonidos en bucle.

• 6 Juego 2 - Dino Jump: Sonido en bucle demo 2

  Vamos a conocer cómo reproducir sonidos en bucle.

• 7 Juego 2 - Dino Jump: Consumibles

  Juego 2 - Dino Jump: Consumibles

• 8 Juego 4 - Plantas vs Zombies: Configurar proyecto

  Vamos a colocar el plugin para manejar el audio y colocar los audios iniciales.

• 9 Juego 4 - Plantas vs Zombies: Zombies, sonido base

  Vamos a implementar un sonido para cada instancia del zombie.

• 10 Juego 4 - Plantas vs Zombies: Zombies, variar sonido por componente

  Vamos a colocar un sonido para cada zombie.

• 11 Sonidos, Reiniciar y/o Reload

  Vamos a hablar sobre un problema con los sonidos en ambiente de desarrollo.

• 12 Juego 4 - Plantas vs Zombies: Detectar fin del juego

  Vamos a detectar cuando acaba el juego, esta función es necesaria para la siguiente implementación que veremos en el siguiente video.

• 13 Juego 4 - Plantas vs Zombies: Reproducir un solo sonido

  Vamos a reproducir un sonido global cuando existan zombies en los canales.

• 14 Juego 5 - Parallax: Sonidos

  Colocaremos los audios para el juego.