Share
En el video anterior te mostré cómo implementar controles de reproducción básicos. Hoy voy a hablar sobre el uso de etiquetas para marcar y navegar a ubicaciones precisas en un TimelineLite. Las etiquetas en TimelineLite funcionan de manera similar a como funcionan las etiquetas de marco en las líneas de tiempo de Flash IDE. Te mostraré varias formas de agregar etiquetas y algunas formas inteligentes de usarlas. También echaremos un vistazo a algunas características exclusivas de TimelineMax.
Echemos un vistazo al ejemplo que construiremos en el video:
Puede encontrar todos los archivos utilizados para crear el SWF anterior en los archivos de origen para este tutorial.
Hay dos métodos que puede usar para agregar etiquetas a un TimelineLite
addLabel (label: String, time: Number): void
Agrega una etiqueta en un momento determinado. Es más común pasar la duración actual de la línea de tiempo como el tiempo.
Accentsconagua
tl.append (TweenMax.to (align_mc, 1, x: endX)); tl.append (TweenMax.to (align_mc, .2, autoAlpha: 0)); // agregar una etiqueta llamada transformar inmediatamente después de que termine la interpolación anterior. tl.addLabel ("transform", tl.duration) tl.append (TweenMax.to (transform_mc, 1, y: endY)); insertar (tween: TweenCore, timeOrLabel: * = 0): TweenCore
Cuando usas insertar() para insertar una interpolación, la interpolación se insertará en el momento o la etiqueta especificada en el segundo parámetro. Si inserta en una etiqueta que aún no existe, colocará esa etiqueta automáticamente al final de la línea de tiempo y luego insertará la interpolación. Esta técnica hace insertar() actuar como un adjuntar() Con el valor añadido de crear una etiqueta..
tl.append (TweenMax.to (align_mc, 1, x: endX)); tl.append (TweenMax.to (align_mc, .2, autoAlpha: 0)); // inserte una interpolación y la etiqueta de transformación inmediatamente después de que termine la interpolación anterior. tl.insert (TweenMax.to (transform_mc, 1, y: endY), "transformar");
El intuitivo de TimelineLite. gotoAndPlay () y gotoAndStop () Los métodos funcionan exactamente como los mismos métodos del objeto MovieClip. Aunque este video se enfoca en usar gotoAndPlay con una etiqueta, también puedes pasar un tiempo.
// salta a la etiqueta de color y reproduce tl.gotoAndPlay ("color"); // saltar 1 segundo en la línea de tiempo y detener tl.gotoAndStop (1); TimelineMax nos da la habilidad única de jugar a una etiqueta particular con el tweenTo () método. Si MovieClips tuviera tal método se llamaría jugar a(). Al final de esta serie, le mostraré cómo agregar una facilidad a un tweenTo () así como una serie de otros trucos.
Debido a la naturaleza introductoria de esta serie, hay algunas características relacionadas con las etiquetas de TimelineLite / Max que no pude cubrir. Los usuarios avanzados pueden querer leer sobre el opcional suprimir eventos parámetro que se puede utilizar con gotoAndPlay () y gotoAndStop () en la documentacion.
TimelineMax tiene una serie de características para determinar los nombres de las etiquetas según su relación con la posición actual de la cabeza lectora o un tiempo específico. Estas propiedades y métodos permiten calcular de forma dinámica cuál es la etiqueta más cercana en cualquier dirección.
actualLabel - La etiqueta más cercana que es en o antes la hora actual.
getLabelBefore (time: Number) - Devuelve la etiqueta anterior (si corresponde) que aparece antes del parámetro de tiempo. Si no pasa un tiempo, se utilizará currentTime..
getLabelAfter (time: Number) - Devuelve la siguiente etiqueta (si corresponde) que ocurre DESPUÉS del parámetro de tiempo. Si no pasas un tiempo, el tiempo actual se utilizará.
Debido a las poderosas propiedades y métodos de TimelineLite / Max, es extremadamente fácil navegar y controlar sus líneas de tiempo basadas en scripts. Las características relacionadas con la etiqueta de las que hemos hablado hoy en realidad no hacen más que resaltar lo que se puede hacer. Una vez que se familiarice con estas técnicas básicas, se encontrará creando líneas de tiempo con características cada vez más dinámicas. Supongamos que desea evitar que un usuario haga clic en el botón "biblioteca" una vez que estén en la sección de la biblioteca. Simplemente puede agregar lógica al controlador de clic del botón que considera lo siguiente:
Si la etiqueta anterior es la misma que la etiqueta del botón en el que se hizo clic, no haga nada..
Siéntase libre de convertir eso a ActionScript si desea algún crédito adicional;)
En el siguiente tutorial, mostraré técnicas avanzadas para agregar toneladas de interpolaciones a una línea de tiempo con muy poco código y extrema precisión..
Si tiene alguna pregunta o comentario sobre este tutorial, simplemente publique un comentario a continuación.
Gracias por ver!
