Practica 16

Practica 16

• 1.
  Lorena Rodríguez Turrubiates ~Practica16 **Crear un submenú** Para obtener el menú desplegable podemos seguir estos pasos: Creamos un símbolo (CTRL + F8) llamado “submenú” de “tipo clip de película” En el nuevo simbolo colocamos los botones que formarán parte del submenú, es decir el que se desplegara, para el ejemplo he colocado 5 botones Los botones que uso para este ejemplo son extraidos de la librería provista en flash, los podemos encontrar en ventana > bibliotecas comunes > botones, elegimos el botón de nuestro agrado y lo arrastramos al escenario. Notemos que el primer botón se encuentra alienado sobre el eje de referencia (la cruz) En cada botón colocamos el siguiente código: on(rollOver){ } this._visible = true; on (press) { } //Tu código para cada boton on (rollOut) { GAEM 3ºC } this._visible = false;
• 2.
  Lorena Rodríguez Turrubiates Estecódigo permite mostrar/ocultar el submenú cuando se pasa el mouse sobre el Seleccionamos el primer botón y desda la barra de propiedades le aplicamos un Alpha al 0% asi De tal modo que tengamos: Este es el lugar que ocupará el botón principal (El que despliega el submenú) Creamos una nueva capa y en ella creamos un rectángulo de tal modo que cubra todos los botones hasta el momento nuestra línea del tiempo se verá asi: El escenrio se verá asi: Notemos que el rectángulo cubre totalmente los botones Ahora cambiamos el punto de referencia del rectángulo creado para ello seleccionamos el rectángulo y con la herramienta “selección libre” GAEM 3ºC
• 3.
  Lorena Rodríguez Turrubiates seleccionamos el centro del rectángulo de tal modo que ahora se ubique en la parte superior asi: Seleccionamos el frame que contiene el rectángulo y lo convertimos en interpolación de movimiento, haciendo click derecho sobre el asi: Seleccionamos alrededor de 5 frames y presionamos la tecla F6 de tal forma que creemos un frame principal Convertimos esta capa en una máscara En la capa “botones” seleccionamos el frame 5 y presionamos F5, nuestra línea de tiempo se verá asi: GAEM 3ºC
• 4.
  Lorena Rodríguez Turrubiates Loque hemos hecho desde el paso 5 hasta este es crear una animacion que despliege el submenu de forma suave. Seleccionamos el último frame de la capa rectángulo y desde el panel de acciones ditamos stop(); Seleccionamos el primer frame de la capa rectángulo y le colacamos la etiqueta abrir. Esto nos permite indicar desde que frame empieza la animación Nuestra linea del tiempo se verá asi: El submenú esta listo, ahora solo nos resta crear el menú, para ello creamos un nuevo símbolo llamado “menu” de tipo “clip de película”. En el nuevo símbolo creamos 2 capas, una llamada “menu” en la que colocamos un nuevo boton y otra llamada “submenu” en la que colocamos el submenu (el simbolo que creamos en los pasos anteriores), nuestra linea del tiempo se verá asi: GAEM 3ºC
• 5.
  Lorena Rodríguez Turrubiates Mientras que los simbolos en el escenario se veran asi: Nota: El simbolo “submenu” se muestra verde pues aplique un color de contorno, caso contrario no se vera en el escenario. El color de contorno lo aplicamos asi: Colocamos el submenu alineado al eje de referencia asi: Colocamos el nuevo boton de igual forma alineado al el eje de referencia asi: Seleccionamos el submenu y le colocamos una etiqueta “clpMenu” En el nuevo botón que colocamos en la capa “menu”, escribimos el siguiente código GAEM 3ºC
• 6.
  Lorena Rodríguez Turrubiates on(rollOver) { if (!this.clpMenu._visible) { this.clpMenu.gotoAndPlay("abrir"); this.clpMenu._visible = true; } } Esto despliega controla el despliege del submenu Ahora solo resta arrastrar el simbolo menu al escenario Al publicar la pelicula el resultado será: GAEM 3ºC