Desde un humilde paseo hasta jefes gigantes y elegantes elementos de interfaz de usuario, ¡los videojuegos tienen que ver con animaciones! En Godot, puedes crear animaciones usando el nodo AnimationPlayer y un sistema de animación flexible que te permite crear tus propias animaciones usando una línea de tiempo. Puedes hacer que los nodos se muevan, cambien de color, emitan sonidos o cualquier otra cosa a lo largo del tiempo en Godot. En este artículo, aprenderá cómo funcionan las animaciones en Godot y cómo crear las suyas propias usando el nodo AnimationPlayer. Aquí hay un resumen de lo que aprenderá: Animar la posición y el color de un objeto Familiarizarse con el nodo AnimationPlayer y el panel Animación Crear una animación recortada Usar otros tipos de pistas para organizar animaciones y reproducir efectos de sonido Nota: este artículo asume que Estoy familiarizado con el editor de Godot. Si no es así, consulte el artículo Introducción. El resultado final de este tutorial será una tarjeta de título animada y un brazo robótico que perfora un bloque. Primeros pasos Para comenzar, descargue los materiales del proyecto a través del enlace Descargar materiales en la parte superior e inferior de esta página. A continuación, importe y edite el proyecto inicial en Godot. Escena principal Una vez cargado el proyecto, serás recibido por la escena principal, que consta de un objeto de fondo y dos nodos ocultos para uso posterior: un brazo robótico y un bloque. Si ejecuta el proyecto, debería ver solo el objeto de fondo. Descripción general del archivo Ahora eche un vistazo a la pestaña Sistema de archivos para ver los recursos incluidos. Aquí hay una descripción general de los archivos y carpetas: escenas: contiene los guiones de escena principales: aquí hay un único guión que se usa para animar los sonidos ocultos del nodo de bloque: esta carpeta contiene el efecto de sonido de perforación para los sprites del brazo robótico: todos los sprites utilizados a lo largo del proyecto. , incluidas las partes del brazo robótico y el fondo credit.txt: Créditos para los activos del proyecto icon.svg: El ícono predeterminado para el proyecto Ahora que tienes una idea de cómo se ve el proyecto, estás listo para saber más sobre el nodo AnimationPlayer! ¿Qué es un AnimationPlayer? El nodo AnimationPlayer contiene animaciones y le permite reproducirlas, pausarlas y detenerlas. Puede manipular las propiedades de los nodos de la escena e interpolarlas a lo largo del tiempo. Por ejemplo, puedes mover un objeto, hacer que los personajes parpadeen y cambiar el material de una malla. Este nodo es uno de los más poderosos de Godot y encontrará usos para él en casi todos los proyectos. Combinado con el panel Animación, el nodo AnimationPlayer le brinda las herramientas que necesita para crear sus propias animaciones. Conceptos básicos de animación Para tu primera animación, animarás la posición y el color de un objeto de título para que se mueva en la pantalla y se desvanezca. Esto cubrirá los conceptos básicos de cómo crear una animación desde cero. Preparando la escena Primero, necesitarás el objeto para la tarjeta de título. Agréguelo a la escena como hijo del nodo raíz principal arrastrando el título.png desde la carpeta de sprites a la ventana gráfica. Seleccione el nuevo nodo Título que creó y cambie su posición a (X: 630, Y: 160) a través del Inspector para que esté en la parte superior de la pantalla. Con el título en su lugar, puedes crear un nodo AnimationPlayer. Continúe y cree un nuevo nodo AnimationPlayer como hijo del nodo raíz principal. Para hacer esto, haga clic derecho en el nodo raíz y seleccione Agregar nodo secundario… en el menú contextual. A continuación, filtre por AnimationPlayer en la barra de búsqueda en la parte superior y haga doble clic en la opción AnimationPlayer para agregarlo a la escena. Para realizar un seguimiento de su propósito, cambie el nombre de este nuevo nodo AnimationPlayer a TítuloAnimationPlayer. Seleccione el nodo TitleAnimationPlayer y debería ver el panel Animación abriéndose en la parte inferior del editor. ¡Aquí es donde ocurre la magia! En la siguiente sección crearás la animación en sí. Creación de la animación Cree una nueva animación haciendo clic en el botón Animación en el panel Animación y seleccionando Nueva. Aparecerá una ventana de diálogo solicitando el nombre de la animación. Ingrese el título como nombre y haga clic en Aceptar para crear la animación. La línea de tiempo ahora se mostrará en el espacio debajo del botón Animación. La animación del título tardará 2 segundos en completarse, así que cambie la duración de la animación a 2 segundos en el extremo derecho del panel de animación, al lado del ícono del reloj. Agregar fotogramas clave Ahora todo está listo para comenzar a agregar fotogramas clave. Los fotogramas clave son puntos en el tiempo de la animación donde cambia un valor. La animación se interpolará entre estos fotogramas clave a lo largo del tiempo. Para mostrar cómo funciona esto en la práctica, seleccione el nodo Título en la escena y observe el Inspector. Con el panel Animación abierto, verá botones clave junto a las propiedades del nodo. Estos botones agregarán un fotograma clave a la animación en la posición actual en la línea de tiempo. Haga clic en el botón de fotograma clave al lado de la propiedad Posición para intentarlo. Después de hacerlo, verá una ventana de diálogo que le preguntará si desea crear una nueva pista y una clave. Una pista de animación es una colección de fotogramas clave. Necesitará una pista separada para cada propiedad que desee animar. De esa forma, puedes animar varias propiedades al mismo tiempo. Aquí hay dos casillas de verificación: Usar curvas de Bézier y Crear pista(s) RESET. El primero habilitará curvas Bézier para la pista de animación, lo que le brindará controles para controlar la forma de la curva para ajustar la animación. Este último creará una animación RESET adicional con el mismo seguimiento de propiedad que restablecerá la propiedad a su valor predeterminado. Puede mantener ambas casillas de verificación en sus valores predeterminados aquí, ya que no necesitará curvas Bézier. Haga clic en Crear para crear las pistas de animación. Ahora eche otro vistazo al panel Animación. Como puede ver, ahora hay una pista para la propiedad Posición del nodo Título. También hay un fotograma clave ahora al inicio de la línea de tiempo, representado por una forma de diamante. Un solo fotograma clave no hará nada, por lo que deberás agregar otro para crear una animación. Para hacerlo, deberá establecer la hora en la que desea que se agregue el nuevo fotograma clave. Mueva el control deslizante de tiempo a la marca de 0,8 segundos arrastrando el cursor sobre el encabezado de la línea de tiempo (los números en la parte superior) o configurándolo directamente en la propiedad de posición de la animación en la parte superior izquierda. Si desea ver incrementos más pequeños en el encabezado de tiempo, mantenga presionada la tecla CTRL/CMD y desplácese hacia arriba.

Source link