- Crear los botones que conformarán al menú, en el archivo de ejemplo se colocaron seis botones, entre parentesis está su nombre de instancia para actionScript, en botón 0 (b0), botón 1 (b1) y botón 2 (b2) y tres sub botones que se despliegan al pasar el mouse sobre el botón 0: botón 0a (b0a), botón 0b (b0b) y botón 0c (b0c)
- Los botones 0, 0a, 0b y 0c se colocan encimados en la misma posición, pueden organizarse en con capas y carpetas, o cambiando su posición con la opción que aparece al dar clic derecho a los botones: Arrange, es importante que el botón 0 sea el que esté sobre los demás.
- Agregar una capa para actionScript y escribir el siguiente código:
import fl.transitions.Tween;
import fl.transitions.easing.*;
b0.addEventListener(MouseEvent.MOUSE_OVER, dropDown);
function dropDown (me:MouseEvent):void {
var b0atween:Tween = new Tween(b0a, "y", Regular.easeIn, 71, 98, .3, true);
var b0bween:Tween = new Tween(b0b, "y", Regular.easeIn, 71, 125, .3, true);
var b0ctween:Tween = new Tween(b0c, "y", Regular.easeIn, 71, 152, .3, true);
}
b0.addEventListener(MouseEvent.CLICK, dropUp);
b0a.addEventListener(MouseEvent.CLICK, dropUp);
b0b.addEventListener(MouseEvent.CLICK, dropUp);
b0c.addEventListener(MouseEvent.CLICK, dropUp);
b1.addEventListener(MouseEvent.CLICK, dropUp);
b2.addEventListener(MouseEvent.CLICK, dropUp);
function dropUp (me:MouseEvent):void {
if (b0a.y == b0.y){
//nada
} else {
var b0atween:Tween = new Tween(b0a, "y", Regular.easeIn, 98, 71, .3, true);
var b0bween:Tween = new Tween(b0b, "y", Regular.easeIn, 125, 71, .3, true);
var b0cween:Tween = new Tween(b0c, "y", Regular.easeIn, 152, 71, .3, true);
}
}
Primero importamos las librerías tween y easing para transiciones de Flash y agregamos un addEventListener a b0 de tipo MOUSE_OVER para que ocurra la función dropDown al pasar el mouse sobre él. Entonces para cada botón del menú desplegable se establece el tiempo y posiciones, antes y después.
Para volver el menú a su posición original al dar clic a algún botón se agrega a todos los botones al darles clic la función dropUp y con un loop (if y else) cuando la posición del botón 0a sea la misma que el 0, no hará nada, luego entonces, si varía, enviará de nuevo a su posición los botones.
archivo de ejemplo referencia de tutvid
Latest Entries »
FLASH ¿Cómo hacer un menú desplegable?
About Me
- Alberto Barrios L.
- Diseñador de Gráficos en Movimiento e Interactividad Multimedia.
ESTUDIOS
- Pasante de la Maestría en Docencia para Arte y Diseño FAD-UNAM 2012-2014.
- Licenciado en Artes Visuales ENAP-UNAM 1999-2004.
- Diplomado en Aplicaciones TIC para la Enseñanza DGTIC-UNAM 2008-2009.
- Diplomado en Realización Cinematográfica ENAP-UNAM 2008-2009.
- Diplomado en Multimedia DGSCA-UNAM 2005-2006.
ACTIVIDAD LABORAL
- Profesor comisionado en apoyo al Centro de Cómputo plantel Azcapotzalco CCH-UNAM 2015-2016.
- Profesor comisionado en apoyo al Centro de Cómputo plantel Vallejo CCH-UNAM 2012-2015.
- Profesor de Opciones Técnicas del Colegio de Ciencias y Humanidades UNAM 2009-2016.
- Instructor de la Dirección General de Cómputo y de Tecnologías de la Información y Comunicación UNAM 2004-2016.
- Colaborador del Área de Postproducción del Observatorio de Visualización de la UNAM-Ixtli DGSCA-UNAM 2004-2010.