Share
No debería sorprender que pueda usar el texto TLF como botón para iniciar un evento en su película. Por ejemplo, podría tener un bloque de texto en el escenario que habla sobre una visita a Times Square en Nueva York, y cuando el usuario hace clic en la frase Times Square, aparece una foto en el escenario. En este ejemplo, va a hacer clic en un texto y una estrella amarilla que creará en el escenario comienza a girar..
El siguiente es un ejercicio de Foundation Flash CS5 para diseñadores por Tom Green y Tiago Dias.Abra un nuevo documento Flash ActionScript 3.0 y guárdelo como TLF_eventLink_AS.fla. Cambie el nombre de la Capa 1 a Estrella y agregue una nueva capa llamada acciones.
Haga clic una vez en el primer cuadro de la capa estrella. Haga clic y mantenga presionado en la herramienta Rectángulo en su barra de herramientas, y seleccione la herramienta Polystar.
En el panel de Propiedades, gire hacia abajo las propiedades de Relleno y Trazo y establezca el valor de Trazo en Ninguno y el valor de Relleno en amarillo (# FFFF00).
Gire hacia abajo la Configuración de herramientas y haga clic en el botón Opciones para abrir el cuadro de diálogo Configuración de herramientas que se muestra en la Figura 6-26. Seleccione Estrella en el menú desplegable Estilo e ingrese 5 para el Número de lados. Haga clic en Aceptar para cerrar el cuadro de diálogo..
Usa la herramienta PolyStar para crear estrellas..
Dibuje una estrella en algún lugar en la mitad inferior del escenario, conviértala en un clip de película llamado Star, establezca su punto de registro en Centro, y en el panel Propiedades, asigne al clip de película Star el nombre de instancia de starMC.
Haga clic en el primer marco de las capas de acciones y abra el panel Acciones. Cuando se abra el panel, haga clic una vez en el panel Script e ingrese el siguiente bloque de código:
var containerSprite: Sprite = new Sprite (); this.addChild (containerSprite); containerSprite.x = 25 containerSprite.y = 50;
Un Sprite es un clip de película virtual sin línea de tiempo. Comenzamos creando un Sprite llamado containerSprite, que se utilizará para mantener el texto. La razón por la que necesitamos esto es porque habrá algo de interactividad involucrada. Este Sprite se coloca a 25 píxeles desde el borde izquierdo del escenario y 50 píxeles desde la parte superior..
Presione la tecla Intro (Windows) o Retorno (Mac) dos veces, e ingrese el siguiente código:
var container: ContainerController = nuevo ContainerController (containerSprite, 400, 300);var config: Configuration = new Configuration (); var charFormat: TextLayoutFormat = new TextLayoutFormat (); charFormat.fontFamily = "Arial, Helvetica, _sans"; charFormat.fontSize = 14; charFormat.color = 0X000000; charFormat.textAlign = TextAlign.LEFT; config.textFlowInitialFormat = charFormat;
Nada nuevo aquí. El contenedor para el texto se crea junto con el Configuración() objeto, y se crea el formato para el texto que se colocará en el contenedor.
Presione la tecla Intro (Windows) o Retorno (Mac) dos veces, e ingrese lo siguiente:
var textFlow: TextFlow = new TextFlow (); var p: ParagraphElement = new ParagraphElement (); p.linkHoverFormat = color: 0XFF0000; p.linkNormalFormat = color: 0x0000FF, textDecoration: TextDecoration.NONE;
Las dos últimas líneas son nuevas, y su propósito es permitirle cambiar el color de una palabra o grupo de palabras cuando el usuario pasa sobre ellas. La propiedad linkHoverFormat pertenece a la clase TextFormat y se usa para indicar a Flash de qué color será el texto identificado como enlace cuando el mouse se desplace sobre él. En este caso, el color cambiará a rojo..
Como puede haber adivinado, la segunda línea le dice a Flash de qué color será el enlace cuando se desplace el mouse. En este caso, será azul. Naturalmente, los enlaces están subrayados tradicionalmente. La forma en que se elimina el subrayado es utilizar la constante NONE, que forma parte de la clase TextDecoration. Si desea el subrayado, sería TextDecoration.UNDERLINE.
El siguiente paso en el proceso es decirle a Flash qué hacer cuando se hace clic en el texto de color.
Presione la tecla Intro (Windows) o Retorno (Mac) dos veces, e ingrese lo siguiente:
var link: LinkElement = new LinkElement (); link.addEventListener (FlowElementMouseEvent.CLICK, linkClicked);
No hay, por supuesto, nada que hacer clic. Vamos a tratar con ese problema.
Presione la tecla Intro (Windows) o Retorno (Mac) un par de veces y agregue lo siguiente:
var linkSpan: SpanElement = new SpanElement (); linkSpan.text = "Haga clic aquí"; link.addChild (linkSpan); var span: SpanElement = new SpanElement (); span.text = "para ver tu estrella girar en el escenario"; p.addChild (enlace); p.addChild (span);
El siguiente paso es hacer que el texto fluya hacia el contenedor..
Presione la tecla Intro (Windows) o Retorno (Mac) y agregue lo siguiente:
textFlow.addChild (p); textFlow.flowComposer.addController (contenedor); textFlow.flowComposer.updateAllControllers ();
El bit de código final es la función que hace que la estrella gire cuando se hace clic en el texto. Introduzca la siguiente:
function linkClicked (evt: FlowElementMouseEvent): void evt.preventDefault (); var tween: Tween = new Tween (starMC, "rotación", Elastic.easeOut, 0, 180, 2, verdadero);
La primera línea de código le dice a Flash que ignore cualquier configuración predeterminada que pueda haber con respecto al mouse y el texto en el contenedor.
La magia sucede en esa segunda línea. Los parámetros le dicen a la clase Tween que trabaje con la propiedad de rotación de la estrella (starMC) y que aplique un cambio de nivel a la estrella cuando termina de girar. Naturalmente, Flash, siendo estúpido, necesita que le digan que la rotación comienza con la estrella a 0 grados y que debe girar 180 grados. Lo hace dos veces y usa los segundos como medida del tiempo..
Haga clic en el botón Revisar sintaxis como primer paso por el código en busca de errores. Si no hay ninguno, su computadora se ding. Si se encuentran errores, se mostrarán en el panel Compilador. El error más común será la ortografía o la falta de una declaración de importación..
Aquí hay un consejo rápido. Si una clase no se muestra como una importación, el panel del compilador le indicará que la propiedad no está definida. Seleccione la clase en el código donde aparece y elimine el texto. Escriba las dos primeras letras de la clase y presione Ctrl + barra espaciadora. La clase aparecerá en la sugerencia de código resultante. Haga doble clic en la clase para volver a agregarla al código. Esto también crea la declaración de importación que falta.
El texto está coloreado. Cuando haces clic en el ratón, la estrella gira. Se incluye una versión completa de este archivo con la descarga de origen..
Estas son las declaraciones de importación para este ejercicio:
importar flash.display.Sprite; importar flashx.textLayout.container.ContainerController; importar flashx.textLayout.elements.Configuration; importar flashx.textLayout.formats.TextLayoutFormat; importar flashx.textLayout.elements.TextFlow; importar flashx.textLayout.elements.ParagraphElement; importar flashx.textLayout.elements.LinkElement; importar flashx.textLayout.elements.SpanElement; importar flashx.textLayout.events.FlowElementMouseEvent; importar fl.transitions.Tween; importar flashx.textLayout.formats.TextDecoration; Importar fl.transitions.easing.Elastic; importar flashx.textLayout.formats.TextAlign;
¿Disfrutaste esto? ¿Quieren más? Siempre puedes comprar una copia de FriendsOfEd ...
Accentsconagua