PulpCore y Gimp – Dandole vida a Alucard

Ha sido casi un mes o mas desde mi ultimo post, lo que pasa es que estuve desarrollando un modulo de lógica difusa y me tomo casi 3 semanas acabarlo, y solo me concentre en eso, ahora que de nuevo he regresado a pulpcore, se me dio por animar a Alucard del juego Castlevania para PS (Castlevania: Symphony of the Night) para esto primero busque imágenes animadas en internet y encontré estas:

y aqui.

Es hora de utilizar el gimp, primero lo bajan de acá

Luego abren las imágenes, por ejemplo el primero y se darán cuenta que se deforma, es porque todas las imágenes son superpuestas, si quieren saber como se anima aquí.

Se dieron cuenta que al abrir el gimp tienen 2 ventanas , un de ellas es la que maneja las capas. al abrir la imagen se vería así

Entonces le comenzamos a dar clic en todos los ojos que parecen, estos son los visores de la imagen, son 16 en total hasta que nuestra imagen ya no tenga nada, luego de esto seleccionamos la primera capa y le damos al ojo, entonces en la imagen aparecerá solo el primer movimiento de alucard

Antes

Despues

Para hacer zoom, solo deben darle clic derecho en la imagen y zoom, o mas practico, ctrl+la rueda del mouse

Ahora creamos una nueva imagen, esta imagen tiene la misma altura, pero el ancho ahora va a albergar a todas las imágenes, en este caso io elijo 8 capas, salteadas: 1, 3, 4, etc.

Vamos activando cada capa (clic en el ojo)y la copiamos a esta nueva imagen, después de copiarlas las desactivamos

Cuando hayan acabado no olviden guardarlo como alucard.png

quedaría así:

Y la frenada comenzamos a partir de la capa 24 hacia el 36 de 2 en 2 y quedaría así:

Si lo desean pueden pintarlos porque como io toy ocioso y se los dejo a uds XD

Bueno ahora que tenemos las 2 imagenes es hora de darle sus propiedades para esto creamos un archivo llamado alucard.properties y llenamos con estas características:

# Numero de frames fisicos (figuras)
frames.across = 8

# Punto Central (De cada frame)
hotspot.x = 25
hotspot.y = 25

#Secuencia de frames. Comienza desde 0 hasta el nro de frames -1
frame.sequence =   0,  1,  2,  3,   4,  5,  6, 7

# Duracion de cada frame en milisegundos (puede ser diferente para cada frame)
frame.duration = 100, 100, 100, 100, 100, 100, 100, 100
#Repite?
loop = true

y alucardFrenada.properties

# Numero de frames fisicos (figuras)
frames.across = 7

# Punto Central (De cada frame)
hotspot.x = 25
hotspot.y = 25

#Secuencia de frames. Comienza desde 0 hasta el nro de frames -1
frame.sequence =   0,  1,  2,  3,   4,  5,  6

# Duracion de cada frame en milisegundos (puede ser diferente para cada frame)
frame.duration = 100, 100, 100, 100, 100, 100, 100
#Repite?
loop = false

Ahora que ya tenemos todo listo pasamos a programar, haremos una animación que vaya de izquierda a derecha por 5 seg, y se frene por 3 seg.

import pulpcore.Stage;
import pulpcore.image.CoreImage;
import pulpcore.scene.Scene2D;
import pulpcore.sprite.FilledSprite;
import pulpcore.sprite.ImageSprite;
import static pulpcore.image.Colors.WHITE;

/**
 *
 * @author Julio Cachay
 */
public class animacion extends Scene2D {

    CoreImage AlucardDer;
    CoreImage AlucardIzq;
    CoreImage AlucardPDer;
    CoreImage AlucardPIzq;
    ImageSprite jugador;
    int i;
    int y;
    double velocidadJugador = 5;

    @Override
    public void load() {
        add(new FilledSprite(WHITE));
        AlucardPDer = CoreImage.load("res/alucardFrenada.png");//Cargamos las imagenes de frenada
        AlucardPIzq = AlucardPDer.mirror();//La imagen de frenada hacia la izquierda
        AlucardDer = CoreImage.load("res/alucard.png");//la imagen de la corrida de alucard
        AlucardIzq = AlucardDer.mirror();
        jugador = new ImageSprite(AlucardDer, 5, Stage.getHeight() / 2);//al medio
        add(jugador);
    }

    @Override
    public void update(int elapsedTime) {
        i = i + elapsedTime; // i se incrementa en el numero de milisegundas despues del ultimo update
        if (i < 5000) {//si no llega a 5 seg
            if (jugador.x.get() >= Stage.getWidth()) {
                velocidadJugador = -velocidadJugador; //da la vuelta
                jugador.setImage(AlucardIzq);
            }
            if (jugador.x.get() <= 0) {
                velocidadJugador = -velocidadJugador;
                jugador.setImage(AlucardDer);
            }
            jugador.x.set(jugador.x.get() + velocidadJugador);
        } else { //si llego a 5 seg
            if (y < 3000) { // si no llega a 3 seg
                y = y + elapsedTime; // y comienza a incrementar
                if (velocidadJugador > 0) {
                    jugador.setImage(AlucardPDer);
                } else {
                    jugador.setImage(AlucardPIzq);
                }
            } else {
                if (velocidadJugador > 0) {
                    jugador.setImage(AlucardDer);
                } else {
                    jugador.setImage(AlucardIzq);
                }
                cargar();// recargamos las imagenes de freno porque el loop es false
                i = 0;
                y = 0;
            }
        }
    }
    void cargar(){//cuando el loop es false la imagen se queda en el ultimo frame, tenemos que recargarlo
        AlucardPDer = CoreImage.load("res/alucardFrenada.png");
        AlucardPIzq = AlucardPDer.mirror();
    }
}

Con esto terminamos, si quieren ver como quedo, o bajarse el código acá

Me voy a ver el partido del Rafa Nadal, Alaoz!!!