Importando y Usando Animaciones

Con hyperPad, puedes crear objetos con animaciones personalizadas. Tienes dos opciones cuando se trata de animaciones. Puedes importar animaciones como fotogramas individuales o una hoja de sprites completa.

Fotogramas Individuales:

Puedes crear un ciclo de animación importando una secuencia de imágenes de fotogramas individuales.

Para comenzar, debes importar tu primer fotograma o una imagen para representar tu objeto desde la "Biblioteca de Recursos" (ver Importando Recursos). Una vez que hayas importado tu objeto, toca y mantén presionado tu dedo sobre el objeto al que deseas agregar animaciones, esto abrirá el Menú de Recursos.

Desde el Menú de Recursos, selecciona "Agregar Animación", esto aparecerá con la opción de importar desde la Cámara o Dropbox. Consulta "Importando Recursos" para más detalles sobre estas opciones.

Una vez que hayas seleccionado tu fuente de importación deseada, puedes seleccionar todos los fotogramas de la animación, luego toca "Listo" en la esquina superior derecha para continuar importando estos fotogramas.

Se te pedirá que ingreses un nombre para el ciclo de animación.

Una vez que hayas ingresado el nombre del ciclo, hyperPad creará una hoja de sprites con todos los ciclos de animación para ese recurso (incluida la representación gráfica original del recurso). Ten en cuenta que hyperPad solo generará una hoja de sprites con una resolución máxima de 2048x2048 píxeles. Esto significa que el tamaño total de cada fotograma importado (incluida la representación gráfica original) no puede exceder el tamaño máximo de la hoja de sprites.

Si estás trabajando con imágenes más grandes, muchos fotogramas de animación, o ambos, probablemente tendrás un error que dice que has superado el tamaño máximo de la hoja de sprites. Si insistes en usar gráficos tan grandes, hay un par de maneras de sortear esto.

1. Divide tus secuencias de animación en múltiples objetos. Cada uno terminará teniendo su propia hoja de sprites de 2048x2048. Así que ten un objeto "caminar", un objeto "saltar", etc. Donde cada objeto almacena el ciclo de animación (o múltiples ciclos). De esta manera generas múltiples hojas de sprites de 2048x2048.

2. No los importes como ciclos de animación. Simplemente importa cada fotograma de animación como su propia imagen. Luego usa el comportamiento "Reproducir Animación" y agrega cada fotograma manualmente a la línea de tiempo de animación en las propiedades del comportamiento.

Hojas de Sprites:

Puedes crear hojas de sprites personalizadas e importarlas a hyperPad vinculando tu proyecto con Dropbox. Para aprender más sobre cómo vincular tu proyecto con Dropbox, consulta "Importando Recursos".

Para crear hojas de sprites personalizadas, puedes usar cualquier herramienta capaz de crear una hoja de sprites compatible con "Cocos2D". Todas las hojas de sprites deben tener un archivo PLIST asociado que contenga los metadatos de la hoja de sprites. Puedes ver el artículo de ayuda "Tipos de Recursos Compatibles" para aprender más sobre hojas de sprites compatibles.

Ver Animaciones:

Si tu recurso tiene animaciones, se etiquetará en la "Biblioteca de Recursos" como un recurso "Animado".

Para previsualizar las animaciones de un recurso, abre el "Menú de Recursos" tocando y manteniendo presionado tu dedo sobre el recurso animado y luego selecciona "Ver Animaciones".

Desde aquí, puedes abrir nuevamente el "Menú de Recursos" y seleccionar "Previsualizar Animación". La ventana emergente reproducirá la animación y también mostrará información útil.

Si tocas y mantienes presionado un ciclo de animación, se abrirá el Menú de Recursos permitiéndote ver los fotogramas individuales para ese ciclo.

Usando Animaciones:

Puedes agregar un recurso animado directamente al lienzo, o usar el comportamiento "Reproducir Animación" para ejecutar una animación bajo demanda.

Para agregar un recurso animado directamente en el lienzo, lanza la "Biblioteca de Recursos" y visualiza las animaciones del recurso animado. Si seleccionas un ciclo de animación, se agregará al "Dock" permitiéndote arrastrarlo directamente a tu escena.

Cuando agregas un ciclo de animación al lienzo, se creará un objeto y se añadirá automáticamente el comportamiento "Reproducir Animación" a él. Si necesitas cambiar la configuración de reproducción de la animación para ese objeto, puedes hacerlo desde los Comportamientos del objeto.

Usando el Comportamiento "Reproducir Animación":

Si necesitas reproducir una animación en un evento, como cuando un usuario presiona un botón o mueve un joystick, entonces puedes usar el comportamiento "Reproducir Animación".

Comienza añadiendo un recurso animado al lienzo. Luego selecciona el objeto y abre el "Editor de Comportamientos" desde las "Propiedades del Objeto".

En este ejemplo, haremos que el objeto reproduzca una animación cuando se presione. Comienza añadiendo el comportamiento "Tocando".

A continuación, añade el comportamiento "Reproducir Animación" de la categoría FX y conéctalo al comportamiento "Tocando" que previamente añadiste.

Una vez que esté conectado, toca el comportamiento "Reproducir Animación" para ver las "Propiedades del Comportamiento". Desde las propiedades del comportamiento, puedes cambiar qué objeto animar, qué animación reproducir y otros varios parámetros que afectan la reproducción de la animación.

En las propiedades del comportamiento, toca la caja etiquetada como "Seleccionar Animación". Esto abrirá la línea de tiempo de animación, permitiéndote agregar fotogramas o un ciclo de animación.

Para agregar animaciones a la línea de tiempo, puedes tocar el ícono de la "Biblioteca de Recursos" para abrir la biblioteca de recursos. Cualquier recurso gráfico que toques se seleccionará automáticamente y se añadirá a la línea de tiempo.

Si deseas agregar un ciclo de animación, presiona y mantén presionado un recurso animado para abrir el "Menú de Recursos". Desde el Menú de Recursos, selecciona "Ver Animaciones". La Biblioteca de Recursos ahora te mostrará todos los ciclos de animación que has añadido previamente al recurso. Tocar un ciclo lo añadirá a la línea de tiempo.

Una vez que hayas terminado de agregar animaciones a la línea de tiempo, puedes tocar la pantalla de comportamiento para cerrar la línea de tiempo y volver al editor de comportamientos.

Si presionas "Reproducir", el objeto solo animará una vez que lo toques.