Implementación de animaciones de hoja de sprites
Entorno de verificación
- Windows
-
- Windows 11
- Unity Editor
-
- 2020.3.25f1
- Paquetes del sistema de entrada
-
- 1.2.0
Requisitos previos para esta sugerencia
Los siguientes ajustes están preconfigurados como requisito previo para la explicación de estos consejos.
¿Qué es la animación de hoja de sprites?
En los juegos modernos, los personajes y los efectos se animan moviendo modelos 3D, calculando explosiones en tiempo real y mostrando efectos. Esto ha sido posible porque la potencia de cálculo de las consolas de juegos ha aumentado, pero como las viejas consolas de juegos no tenían tanta potencia, la animación de hojas de sprites que cambiaba continuamente las imágenes para que pareciera que se estaba moviendo era la corriente principal. El principio es el mismo que el del anime que se juega en la televisión. Las animaciones de hojas de sprites son utilizadas por menos juegos que en el pasado, pero todavía se usan a menudo porque la carga requerida para los cálculos es mucho menor.
La animación de la hoja de sprites cambia y muestra varias imágenes seguidas. Es raro preparar tantos archivos de imagen como hay, y básicamente todos los patrones de visualización están incluidos en una imagen. Esto facilita la administración de archivos de imagen y reduce la carga de archivos de imagen. El archivo de imagen que resume esta animación se denomina "hoja de sprites".
Crear una hoja de sprites
Una hoja de sprites es esencialmente un archivo de imagen. Dado que no tiene nada que ver con Unity, créalo con una herramienta de edición de imágenes. El formato de archivo final será un archivo PNG que Unity puede manejar.
Además, existen las siguientes reglas para crear hojas de sprites.
- Unifica el tamaño de imagen de todos los fotogramas. Por ejemplo, si la primera imagen es de 32x32 píxeles, la segunda imagen y las siguientes serán de 32x32 píxeles. Por ejemplo, si preparas una hoja de sprites en un formato de "3x2" con 6 fotogramas, el tamaño de la hoja de sprites será de 96x64 píxeles.
- Puede alinear la imagen libremente, como "6x4" o "2x8", pero asegúrese de crearla asumiendo que se rellenarán todos los marcos. Si es "6x4", son 24 fotogramas, y así sucesivamente. Si se trata de una animación de 13 fotogramas, prepárala con "1x13" o "13x1".
- Al tratarse de una animación, está correctamente alineada para que no haya desalineación en los fotogramas antes y después.
- La dirección de la animación comienza desde la celda superior izquierda y va hacia la derecha, y cuando vas al extremo derecho, comienza desde la izquierda un paso hacia abajo y vuelve a ir a la derecha.
De hecho, no tienes que hacer lo anterior estrictamente en Unity, pero es mucho más fácil decidir las especificaciones de antemano.
Esta vez, usaré una hoja de sprites para cambiar los siguientes números. Un cuadrado es de 32x32 píxeles. Consta de 24 marcos "6x4", por lo que el tamaño de la imagen es de 192x128 píxeles.
Configuración de la hoja de sprites en el Editor de Unity
Una vez que hayas creado tu proyecto, agrega un archivo de hoja de sprites a tu proyecto.
Aquí, se supone que el nombre del archivo es NumberAnimation .
NumberAnimation Seleccione el archivo y rellene el inspector de la siguiente manera:
| Valores de los artículos | |
|---|---|
| Tipo de textura | Sprites (2D y UI) |
| Modo Sprite | plural |
Hay muchos otros ajustes que se pueden configurar, pero dejémoslo como está por ahora. Una vez configurado, haz clic en el botón "Editor de sprites".
Si aparece el cuadro de diálogo a continuación, haga clic en el botón "Aplicar". De hecho, la configuración de este inspector debe guardarse, y si se desplaza hasta la parte inferior, hay un botón "Aplicar", por lo que debe guardar la configuración con este botón. También se guardará mediante "Aplicar" en el cuadro de diálogo, por lo que no importa de qué manera lo guarde.
Aparece el Editor de Sprites. En esta sección, trabajaremos en la división del sprite de la hoja de sprites.
Hay un botón llamado "Cortar" en la esquina superior izquierda, haga clic en él y cambie el tipo a "Cuadrícula por tamaño de celda". En esta hoja de sprites, un tamaño del sprite es de "32x32" píxeles, así que introduce 32 para cada tamaño de píxel. Cuando haya terminado, haga clic en el botón Sector.
Esta imagen es difícil de entender porque parece estar claramente dividida desde el principio, pero está dividida por 1 sprite 32px. Presione la tecla "Ctrl" y la línea de división aparecerá en verde.
Después de dividirlo, guárdelo con el botón "Aplicar".
Si haces clic en el triángulo del archivo de imagen del proyecto para expandirlo, puedes ver que el sprite se ha dividido.
Colocación y animación de sprites
Arrastre el sprite establecido a la vista y colóquelo.
A continuación, aparecerá un cuadro de diálogo, así que guárdelo NumberAnimation como .
Este archivo contiene la configuración de animación.
El primer sprite se coloca en la vista y se crean un controlador de animación y un clip de animación en el proyecto. Si la imagen es pequeña, ajuste la escala para hacerla más grande.
En este punto, se aplicará la configuración de animación predeterminada, por lo que puede ejecutar el juego. Deberías poder ver que la animación del sprite se mueve tan pronto como comienza el juego.
Evitar que las animaciones se repitan
Seleccione el archivo de clip de animación (NumberAnimation.anim) del proyecto.
En el inspector, hay una casilla de verificación para "Tiempo de bucle", así que desmárquela.
Si ejecutas el juego, verás que la animación se detiene en 24. Es eficaz para efectos de explosión de una sola vez.
Cambiar la velocidad de la animación
Seleccione el sprite que desea animar de la jerarquía.
A continuación, seleccione la pestaña Animación. Si no tiene una pestaña Animación, seleccione Ventana > Animación > Animación en el menú.
Hay un número llamado "muestra", que es un número de veces para cambiar de imagen en un segundo. En este ejemplo, la animación es de 24 fotogramas, por lo que la animación se repite cada 2 segundos.
Si disminuye este número, la velocidad de animación será más lenta y, si la aumenta, la velocidad aumentará.
Acerca de otras opciones de configuración de animación avanzadas
Los distintos ajustes de animación se explican por separado en los consejos específicos de animación. Estos ajustes no son exclusivos de las animaciones de sprites, pero no son exclusivos de la función Es lo mismo que configurar otras animaciones de movimiento y animaciones 3D.
En este consejo, explicaremos cómo pasar de una hoja de sprites a una animación.