Este documento proporciona instrucciones en 23 pasos para crear un menú de botones interactivo en Adobe Flash. Los pasos incluyen cambiar las propiedades del botón, agregar fotogramas clave, agregar texto a los botones, agregar acciones para cambiar entre escenas abiertas y cerradas al pasar el cursor sobre los botones, y crear un rectángulo para cubrir los botones. El objetivo general es crear un menú de navegación básico con botones que cambian entre dos estados al interactuar el usuario.
2. Paso 1.- Cambiamos
las propiedades, para
esto en la parte
inferior en la opción
tamaño damos clic y
nos aparecerá el
siguiente recuadro. Ya
que hayamos
cambiado las
dimensiones
(anchura) x(altura) y
la Velocidad de
fotogramas damos
clic en Aceptar.
3.
4.
5. Paso 5.- Ya que este convertido en botón, daremos doble clic sobre e
insertamos un fotograma clave. Y ya que este insertado lo suprimimos.
6.
7. Paso 7.- Una vez realizado lo anterior volvemos a Escena y presionamos
Ctrl + Enter y nos aparecerá un recuadro en el cual podremos ver los
efectos de nuestro botón.
Efecto sin
presionar
Efecto presionado
8. Paso 8.- Eliminamos el símbolo presionando suprimir, insertamos un
nuevo símbolo con tipo Clip de película y con nombre en este caso
de button1-mc, y damos clic en Aceptar.
Paso 9.- Ya que este realizado el botón anterior, vamos a pasar el
botón que hicimos antes el cual quedo guardado en la biblioteca.
9. Paso 10.- Ya que este insertado el botón, en la capas cambiaremos el
nombre de la capa a “botones”, después en el fotograma numero 20
vamos a insertar otro fotograma clave con F6.
10.
11. Paso 12.- Ya que tengamos los 5 botones, lo que vamos a hacer
es una nueva capa y la llamaremos “textos”
Paso 13.- Después en el fotograma 1 vamos a escribir lo que queramos
que aparezca en nuestro primer botón. En este caso escribiremos
“Menú”.
Para escribir un texto, se selecciona la herramienta Texto y se desliza
sobre el botón y listo.
12. Paso 14.- Después en el fotograma 20 de la capa textos insertamos un
nuevo fotograma clave. Y seguiremos escribiendo los textos de los
demás apartados.
Y quedara como se muestra en la imagen de la parte derecha.
Paso 15.- Vamos a crear una nueva capa y la llamaremos
Acciones.
13. Paso 16.- Ya que hayamos creado la capa “acciones”. En la parte
superior en “acciones escribiremos “stop ();”
Paso 17.- Creamos una nueva capa y la llamaremos “labels”, en el primer
fotograma vamos a la ventana de propiedades y en el titulo de fotograma
pondremos “closed”
14. Paso 18.- En el fotograma 20 de la misma capa insertamos un nuevo
fotograma con F6 y ese lo llamaremos “open”
Paso 19.- Después vamos a bloquear todas las capas excepto la de
botones.
Paso 20.- Seleccionamos la capa botones en el fotograma 1 y en acciones
escribiremos lo siguiente.
1 on (rollOver) {
2 gotoAndStop("open");
3}
15. Paso 21.- Vamos a crear otra capa mas y la vamos a llamar “cerrar
botones” e insertamos un nuevo fotograma clave en el 20.
Paso 22.- Después vamos a crear un rectángulo blanco y después ese
rectángulo lo convertiremos en símbolo
Paso 23.- Vamos a dar doble clic y arrastraremos de “Reposo hasta
Zona activa”.