Animaciones de sprites

Motor de Sprite

El motor de sprites de Qt Quick sprite engine es una máquina de estados estocástica combinada con la capacidad de trocear imágenes que contienen múltiples fotogramas de una animación.

Máquina de estados

Una función primaria del motor de sprites es su máquina de estados interna. No es lo mismo que los estados y transiciones de Qt Quick, y se parece más a una máquina de estados convencional. Los sprites pueden tener transiciones ponderadas a otros sprites, o de vuelta a sí mismos. Cuando la animación de un sprite termina, el motor de sprites elegirá el siguiente sprite aleatoriamente, basándose en las transiciones ponderadas disponibles para el sprite que acaba de terminar.

Puedes afectar al sprite que se está reproduciendo de dos maneras. Puedes forzarlo arbitrariamente a que empiece a reproducir inmediatamente cualquier sprite, o puedes indicarle que haga una transición gradual a un sprite determinado. Si le indicas que realice una transición gradual, entonces alcanzará el sprite objetivo pasando por transiciones de estado válidas utilizando el menor número de sprites intermedios (pero ignorando las ponderaciones relativas). Esto permite insertar fácilmente una animación de transición entre dos sprites diferentes.

Como ejemplo, considere el diagrama anterior, que ilustra los sprites de un hipotético personaje de un juego de plataformas en 2D. El personaje comienza mostrando el estado de parado. A partir de este estado, salvo entrada externa, pasará a la animación de espera, a la animación de caminar o volverá a reproducir la animación de estar de pie. Como los pesos para esas transiciones son uno, cero y tres respectivamente, tiene una posibilidad entre cuatro de jugar la animación de espera cuando termina la animación de estar de pie, y una posibilidad de tres entre cuatro de volver a jugar la animación de estar de pie. Esto permite que el personaje tenga un comportamiento ligeramente animado y variable mientras espera.

Debido a que hay una transición de peso cero a la animación de caminar, la animación de estar de pie normalmente no hará la transición allí. Pero si configuras la animación meta para que sea la animación caminando, reproducirá la animación caminando cuando termine la animación parado. Si estaba previamente en la animación de espera, terminaría de reproducirla, luego reproduciría la animación de estar de pie, luego reproduciría la animación de caminar. Continuará reproduciendo la animación caminando hasta que la animación objetivo se desactive, en cuyo momento cambiará a la animación de pie después de terminar la animación caminando.

Si entonces estableces el estado de meta a la animación de salto, terminaría la animación de caminar antes de reproducir la animación de salto. Como la animación de salto no hace transición a otros estados, seguirá reproduciendo la animación de salto hasta que el estado sea forzado a cambiar. En este ejemplo, podrías volver a ponerlo en caminar y cambiar la animación de meta a caminar o a nada (lo que lo llevaría a reproducir la animación de estar de pie después de la animación de caminar ). Note que al forzar la animación, puede comenzar a reproducir la animación inmediatamente.

Formato de entrada

Los formatos de archivo aceptados por el motor de sprites son los mismos que los formatos de archivo aceptados por otros tipos de QML, como Image. Sin embargo, para animar la imagen, el motor de sprites necesita que el archivo de imagen contenga todos los fotogramas de la animación. Deben estar dispuestos en una línea contigua, que puede envolver desde el borde derecho del archivo a una fila inferior que comienza en el borde izquierdo del archivo (y que se coloca directamente debajo de la fila anterior).

Tomemos como ejemplo la imagen anterior. Por ahora, considere sólo los números negros, y suponga que los cuadrados son de 40x40 píxeles. Normalmente, la imagen se lee desde la esquina superior izquierda. Si se especifica el tamaño del cuadro como 40x40 píxeles, y un recuento de cuadros de 8, entonces se leerían los cuadros a medida que se numeran. El cuadro de arriba a la izquierda sería el primer cuadro, el cuadro de arriba a la derecha sería el quinto cuadro, y luego pasaría a la siguiente fila (en la posición de píxel 0,40 en el archivo) para leer el sexto cuadro. Dejaría de leer después del fotograma marcado como 8, y si hubiera algún dato de imagen en el cuadrado debajo del fotograma cuatro, entonces no se incluiría en la animación.

Es posible cargar animaciones desde un desplazamiento arbitrario, pero seguirán el mismo patrón. Consideremos ahora los números rojos. Si especificamos que la animación comienza en la posición de píxel 120,0, con un número de fotogramas de 5 y el mismo tamaño de fotograma que antes, entonces cargará los fotogramas tal y como están numerados en rojo. Los primeros 120x40 de la imagen no se utilizarán, ya que comienza a leer bloques de 40x40 desde la ubicación 120,0. Cuando llega al final del fichero en 160,0, empieza a leer la siguiente fila desde 0,40.

Los números azules muestran los números de fotograma si intentara cargar dos fotogramas de ese tamaño, empezando desde 40,40. Tenga en cuenta que es posible cargar múltiples sprites desde un archivo de imagen. Los números rojo, azul y negro pueden ser cargados como animaciones separadas en el mismo motor de sprites. El siguiente código carga las animaciones según la imagen. También especifica que las animaciones deben reproducirse a 20 fotogramas por segundo.

Sprite {
    name: "black"
    source: "image.png"
    frameCount: 8
    frameWidth: 40
    frameHeight: 40
    frameRate: 20
}
Sprite {
    name: "red"
    source: "image.png"
    frameX: 120
    frameCount: 5
    frameWidth: 40
    frameHeight: 40
    frameRate: 20
}
Sprite {
    name: "blue"
    source: "image.png"
    frameX: 40
    frameX: 40
    frameCount: 2
    frameWidth: 40
    frameHeight: 40
    frameRate: 20
}

Los fotogramas de una animación deben tener el mismo tamaño. Sin embargo, las animaciones múltiples dentro del mismo archivo no. Los sprites sin especificar frameCount suponen que ocupan todo el archivo, y debe especificar el tamaño de fotograma. Los sprites sin un tamaño de fotograma asumen que son cuadrados y ocupan todo el archivo sin envolver, y debes especificar un recuento de fotogramas.

El motor de sprites copia y recorta internamente las imágenes para ajustarlas a un formato interno más fácil de leer, lo que conlleva algunas limitaciones de memoria gráfica. Debido a que requiere que todos los sprites de un mismo motor estén en la misma textura, intentar cargar muchas animaciones diferentes puede llevar a límites de memoria de textura en dispositivos embebidos. En estas situaciones, se mostrará una advertencia en la consola con el tamaño máximo de la textura.

Existen varias herramientas que ayudan a convertir un conjunto de imágenes en hojas de sprites. He aquí algunos ejemplos:

• Plugin de Photoshop: http://www.johnwordsworth.com/projects/photoshop-sprite-sheet-generator-script
• Plugin SpriteSheet de Gimp
• Herramienta Cmd-line: http://www.imagemagick.org/script/montage.php

Tipos de QML con el motor de sprites

Los sprites para el motor de sprites pueden definirse utilizando el tipo Sprite. Este tipo incluye los parámetros de entrada, así como la duración de la animación y las transiciones ponderadas a otras animaciones. Es puramente una clase de datos, y no renderiza nada.

SpriteSequence es un tipo que utiliza un motor de sprites para dibujar los sprites definidos en él. Es un motor de sprites único y autónomo, y no interactúa con otros motores de sprites. Los tipos Sprite pueden compartirse entre tipos que utilizan motores de sprites, pero esto no se hace automáticamente. Así, si has definido un sprite en un SpriteSequence tendrás que redefinirlo (o hacer referencia al mismo tipo Sprite ) en la propiedad sprites de otro SpriteSequence para poder pasar a esa animación.

Además, ImageParticle puede utilizar tipos Sprite para definir sprites para cada partícula. De nuevo, se trata de un único motor de sprites por tipo. Esto funciona de forma similar a SpriteSequence, pero también tiene la variabilidad parametrizada proporcionada por el tipo ImageParticle.

Tipo AnimatedSprite

Para casos de uso que no necesitan transición entre animaciones, considere el tipo AnimatedSprite. Este tipo muestra animaciones de sprites con el mismo formato de entrada, pero sólo una a la vez. También proporciona un control manual más preciso, ya que no hay un motor de sprites que gestione los tiempos y las transiciones entre bastidores.