Skip to content
diciembre 2, 2010 / 100xna

[Intermedio] Como usar el Mercury Particle Engine (II)


Hace un tiempo, os comentaba como podíamos usar el Mercury Particle Engine en nuestros juegos para añadir partículas. Sin embargo, la forma de crear las partículas era tediosa. En esta segunda entrega, veremos como poder añadir efectos ya creados con el editor que incorpora MPE y veremos como la carga del efecto se realiza simplemente con un XML.

Lo primero de todo vamos a crear un proyecto nuevo o vamos a reutilizar el que ya creamos para el ejemplo anterior. Yo voy a crear un proyecto nuevo, aunque podríais partir del ejemplo de la anterior entrega.

Una vez tengamos el proyecto creado, tenemos que agregar las referencias del MPE tanto al juego como al Content. Para hacerlo, ya sabéis: Botón derecho sobre “References” , “Agregar Referencia” y buscamos la librería de Mercury en el lugar donde la hayamos descomprimido.

image

Nos debe quedar de esta forma:

image

 

Ahora ya podremos trabajar y cargar el XML de MPE.

Lo primero de todo que vamos a hacer es cargar el “ParticleEffect” creado con el editor así como todas las texturas que necesita ese efecto. En este ejemplo vamos a usar "un efecto que ya viene con el editor llamado “BasicFireball”. Este efecto necesita tres texturas, con lo que cargamos el XML y las texturas que necesita. En este caso, “Cloud001”, “Cloud004” y “Particle 004”. Las texturas se encuentran en la carpeta “Textures” que viene junto al editor, y el XML en la carpeta “EffectLibrary” del editor también.

image

 

Ahora que ya tenemos todos los recursos y librerías necesarias agregados al proyecto, vamos al código.

Lo primero que hacemos, al igual que en la anterior entrega, es dos variables:

 

  1 Renderer mpeRenderer;   //Render donde se pintará el efecto del MPE
  2 ParticleEffect fuego;   //Efecto MPE

 

En el metodo “Initialize” creamos el Renderer de la misma forma que la entrega anterior:

  1 mpeRenderer = new SpriteBatchRenderer
  2 {
  3     GraphicsDeviceService = graphics
  4 };

 

Y ahora viene la gran diferencia con el tutorial anterior. En lugar de crear el efecto “a mano” mediante programación, vamos a cargarlo directamente de un XML. Para ello, en el método “LoadContent” vamos a escribir lo siguiente:

  1         protected override void LoadContent()
  2         {
  3             // Create a new SpriteBatch, which can be used to draw textures.
  4             spriteBatch = new SpriteBatch(GraphicsDevice);
  5
  6             // TODO: use this.Content to load your game content here
  7             fuego = Content.Load<ParticleEffect>("BasicFireball");
  8             fuego.LoadContent(Content);
  9             mpeRenderer.LoadContent(Content);
10             fuego.Initialise();
11         }

Como podéis observar, con una sola línea cargamos el efecto completo. Luego tenemos que indicarle tanto al ParticleEffect como al Renderer el directorio Content donde se encuentran los recursos e inicializar el efecto creado.

Ahora que ya tenemos el efecto creado y cargado, solo nos queda actualizarlo y dibujarlo. Como este es un ejemplo para que veáis como se usa el MPE, no vamos a complicarlo mucho. Simplemente, que el efecto se pinte por donde pasa el cursor del ratón. Para ello, en el método “Update” vamos a hacer lo siguiente:

  1         protected override void Update(GameTime gameTime)
  2         {
  3             // Allows the game to exit
  4             if (Keyboard.GetState().IsKeyDown(Keys.Escape))
  5                 this.Exit();
  6
  7             // TODO: Add your update logic here
  8             fuego.Trigger(new Vector2(Mouse.GetState().X, Mouse.GetState().Y));
  9
10             //Actualizamos el efecto
11             float deltaSeconds = (float)gameTime.ElapsedGameTime.TotalSeconds;
12             fuego.Update(deltaSeconds);
13
14
15
16             base.Update(gameTime);
17         }

Como veis, cada vez que se ejecute el Update vamos a emitir un nuevo efecto con “fuego.Trigger” y vamos a actualizar las partículas de ese efecto, tanto las que acabamos de emitir como las que hemos emitido anteriormente y que aun están “activas”. Eso lo conseguimos con la línea “fuego.Update(deltaSeconsds);”

Lo ultimo que nos queda por hacer es dibujar el efecto por pantalla. Con una sola línea en el método “Draw” conseguimos esto:

  1         protected override void Draw(GameTime gameTime)
  2         {
  3             GraphicsDevice.Clear(Color.Black);
  4
  5             // TODO: Add your drawing code here
  6
  7             //Dibujamos el efecto MPE
  8             mpeRenderer.RenderEffect(fuego);
  9
10
11             base.Draw(gameTime);
12         }

Y ya esta, ya tenemos funcionando nuestro efecto de partículas creado con el editor de MPE.

Este es el resultado:

image

Un saludo

DownloadDescargar Código Fuente XNA 4.0

Anuncios

One Comment

  1. Cristobal / Nov 24 2012 5:05 pm

    Que tal amigo, son muy buenos tus tutoriales, disculpa tengo problemas en pasar a XNA 4 este proyecto, ya tengo todo… pero… me sale un error dentro del xml que no existe “ProjectMercury.ParticleEffect” si podrias ayudarme con eso porfavor…

Los comentarios están cerrados.

A %d blogueros les gusta esto: