Embed Size (px)
Citation preview
#dotNETSpain2015
#dotNETSpain2015
Disclaimer...
#dotNETSpain2015
#dotNETSpain2015#dotNETSpain2015
¡Contrata a un grafista!
¡Importante!
Todas las imágenes usadas en el juego están vilmente rapiñadas de Internet.¡No hagas eso!
#dotNETSpain2015
Introducción a Wave Engine
Eduard Tomàs@eiximenis
#dotNetSpain2015
#dotNETSpain2015
Conceptos básicos
#dotNETSpain2015#dotNETSpain2015
Motor de videojuegos 2D / 3DMultiplataforma (Windows, Android, iOS, WP, MacOS,...)Desarrollo en .NET y VS2013
Características de Wave
#dotNETSpain2015#dotNETSpain2015
De varias escenas...
... Cada una de las cuales tiene varias entidades
... Cada una de las cuales está formada por varios componentes.
Un videjuego en Wave se compone...
#dotNETSpain2015#dotNETSpain2015
Todo videojuego tiene una o más escenas
En todo momento se reproduce una sola escena
Las escenas van bien para separar recursos de fases separadas del videojuego (menú principal, fases (si se cargan por separado), etc)
Escena
#dotNETSpain2015#dotNETSpain2015
Una entidad es un elemento que:
Se puede ver (aunque no es obligatorio)Tiene un cierto comportamiento
Es la abstracción de alto nivel (personaje principal, enemigo, poción mágica, pared,...)
Entidad
#dotNETSpain2015#dotNETSpain2015
Una entidad contiene un conjunto de componentes que colaboran entre ellos para
Decidir como se dibuja la entidad
Decidir qué hace la entidad (comportamiento)
Entidad
#dotNETSpain2015#dotNETSpain2015
Son la base a partir de la cual se construyen las entidades
Dos grandes bloques de Componentes
Componentes
Componentes
Drawables
Behaviors
#dotNETSpain2015#dotNETSpain2015
Son componentes que dibujan algo en pantalla.
Método Draw()
SpriteRenderer: Dibuja una textura en pantallaTransform2D: Aplica rotaciones, translaciones, escalados a una textura
Drawables
#dotNETSpain2015#dotNETSpain2015
Son componentes que tienen un comportamiento.
Modelan IA, física o cualquier otro comportamiento
Método Update()
Behaviors
#dotNETSpain2015#dotNETSpain2015
Wave contiene distintos elementos de UI (Textbox, botones, sliders, paneles) pensados para un prototipado rápido de UI
Inspirados en WPF
Se renderizan en una capa propia (UI)
No son entidades
Ementos de UI
#dotNETSpain2015
Creando un videojuego
#dotNETSpain2015#dotNETSpain2015
UI
Entidad
Una escena que contendrá una entidad (imágen de fondo) y un elemento de UI (texto)
01 - Pantalla incial
•Transform2D•Para posicionar el elemento
•SplashScreen•Para centrar el elemento
•Sprite•Para texturizar el elemento
•SpriteRenderer•Para dibujar el elemento
•TextBox•Para dibujar texto
#dotNETSpain2015#dotNETSpain2015
Componente propio que requiere y modifica un componente Transform2D:
Componente SplashScreen
public class SplashScreen : Drawable2D { [RequiredComponent] public Transform2D Transform { get; set; } private bool _centered = false; public override void Draw(TimeSpan gameTime) { if (!_centered) { Transform.Center(); } } }
#dotNETSpain2015#dotNETSpain2015
Para usar imágenes, fuentes, sonidos, deben convertirse al formato de Wave (.wpk)
Para ello se edita el fichero Resources.weproj con el Asset Exporter
Recursos en Wave
#dotNETSpain2015#dotNETSpain2015
Entidad con comportamiento propio
Típico error de principiante:
02 – Personaje principal
public class MainCharacter : Entity{ // Error: Entity es sealed}
#dotNETSpain2015#dotNETSpain2015
Usar el patrón Factory para crear las diversas Entidades
Crear una factoría de entidades
Registrarla como servicio de Wave
Solución (mía...)
#dotNETSpain2015#dotNETSpain2015
Una imagen con todos los posibles sprites
Un componente Animation2D con varios estados (andando, saltando, idle,...)
Una descripción que indique a que sprite de la imagen se corresponde cada frame de la animación por cada estado
Animaciones por sprite sheet
#dotNETSpain2015#dotNETSpain2015
Componentes que encapsulan el comportamiento de una entidad
Una entidad sin Behaviors no hace nada, no responde a nada
Behaviors
#dotNETSpain2015#dotNETSpain2015
Entidad Homer
•Transform2D•Para posicionar el elemento
•Sprite•Para texturizar el elemento•Contiene todo el SpriteSheet
•Animation2D•Para definir que parte de la textura corresponde a cada estado
•AnimatedSpriteRenderer()•Para dibujar el elemento (con la sub-textura correcta)
•HomerBehavior•Para que la entidad se comporte como Homer (ande al pulsar en la pantalla)
#dotNETSpain2015#dotNETSpain2015
Cada cerveza es una entidad
Se crean y se destruyen dinámicamente
Entidad adicional con un behavior para gestionar esa creación
03 – Cervezas
#dotNETSpain2015#dotNETSpain2015
Para detectar colisiones se usa un componente especifico, llamado collideRectangleColliderCircleColliderPerPixelCollider
Los colliders no se están comprobando contínuamente. Debe ser bajo demanda.collider.Insterects(otherCollider);
Detección de colisiones
#dotNETSpain2015#dotNETSpain2015
Permiten simular grandes grupos de partículas (p. ej. Explosiones) de forma rápida y sencilla
Comportamientos realistas
Sistemas de partículas
#dotNETSpain2015#dotNETSpain2015
FondoHomerBeerManager: Encargada de ir creando las cervezas y asignarles un movimientoBeer: Creadas dinámicamente por BeerManager.Explossion: Creada dinámicamente cuando una cerveza impacta con Homer
Entidades de la escena
#dotNETSpain2015#dotNETSpain2015
Definir comportamientos físicamente realistas a los impactos
Definir movimientos físicamente realistas
Definir propiedades físicas de los objetos
04 - Física
#dotNETSpain2015#dotNETSpain2015
RigiBody es un componente que dota de “realidad física” una entidad
Static: Tiene masa, movimiento controlado por códigoKinematic: Sin masa y movimento controlado por el motor de físicaDynamic: Con masa y movimiento controlado por el motor de física
RigiBody
#dotNETSpain2015#dotNETSpain2015
Un RigiBody de tipo Dynamic o Kinematic controlará el movimiento de la entidad a la que esté asociado
(Modificará la Transform2D associada a dicho elemento)
RigiBody (ii)
#dotNETSpain2015#dotNETSpain2015
Los objetos con RigiBody colisionan automáticamente unos con otros
Recibimos evento cuando ocurre una colisión
RigiBody.OnPhysic2DCollision += OnCollision;void OnCollision(object sender, Physic2DCollisionEventArgs args) {}
Colisiones
#dotNETSpain2015#dotNETSpain2015
Wave ofrece varios servicios para acceso al hardware o funcionalidad variada
Funcionan como singletons
API independiente de la plataforma
Servicios Wave
#dotNETSpain2015#dotNETSpain2015
Podemos registrar nuestros propios servicios
WaveServices.RegisterService<MyService>(new MyService());WaveServices.GetService<MyService>();
Servicios Wave
#dotNETSpain2015#dotNETSpain2015
Entrada (teclado, pads, mouse, ...)SonidoRandomizerPlatform (valores dependientes de la plataforma como tamaño pantalla)TouchPanelViewPortManager (para gestionar distintos tamaños de pantalla)ScreenContextManager (para gestionar cambios de escena)
Servicios Wave
#dotNETSpain2015#dotNETSpain2015
http://www.waveengine.net/
http://es.slideshare.net/waveengineteam
https://github.com/WaveEngine/
Recursos
#dotNETSpain2015#dotNETSpain2015
Separar una imágen en un pack de spriteshttp://www.alferdspritesheetunpacker.forkandbeard.co.uk/forkandBeard/apps/AlferdSpritesheetUnpacker/Download.aspx
Crear una spritesheet y su descripción a partir de un pack de imágeneshttps://www.codeandweb.com/texturepacker/
Herramientas usadas
#dotNETSpain2015#dotNETSpain2015
Descarga WaveMira los tutoriales y...
Si te has quedado con ganas de más...
¡Compra mi libro!(Valee... Eso es broma :P)
#dotNETSpain2015
Eduard TomàsBeer Developer@[email protected]
¡¡¡Si te ha gustado no olvides rellenar la encuesta!!!Thanks
Y
AX B
