jueves, 26 de enero de 2012

Boton Animado



Para crear un botón animado en flash debes:

Primero crear un objeto (circulo), queremos que aparezca encima del circulo una mano para saber que es un botón, seleccionamos el circulo y nos vamos a modificar y lo convertimos en símbolo tipo botón y aceptamos.

Con el simple hecho de convertirlo en botón al oprimir ctrl.+ENTER y el usuario pasa el cursor por encima del círculo aparecerá la mano, esto quiere decir que ya tenemos un botón; ahora le pondremos animación:
Después de convertirlo en botón le damos doble clic al circulo, fíjense en la línea del tiempo que dice que estamos en un símbolo tipo botón que esta situado en nuestra escena en esa línea de tiempo podrán ver los estados en los cuales puede estar un botón Reposo, cuando nadie se sitúa encima del objeto, el estado Sobre cuando el usuario sitúa el cursor en el objeto 



 Ahí podremos configurar como queremos que se sitúe el botón, como queremos animarlo y que sea diferente damos clic derecho e insertaremos un fotograma clave, pulsamos fuera del círculo, ahora en este caso haremos que el contorno sea diferente, que crezca, seleccionamos el contorno y vamos a crear una animación independiente de este contorno.

Para poder crear animaciones independientes, lo convertimos a símbolo (contorno) pero en este caso en clip de película, el tipo clip de película tendrá animaciones independientes, hacemos doble clic en el contorno y nos aparece la línea de tiempo que ya conocemos, damos clic derecho en el fotograma

crear interpolación de movimiento y en el fotograma 10 insertamos un fotograma clave ahora realizaremos el cambio seleccionando la herramienta transformación libre y lo haremos mas grande, ahora solo nos falta agregar el efecto ALFA, nos vamos ala ventana de propiedades color alfa y cero porcentaje. Presionamos CTRL+ENTER y tenemos un botón que en estado reposo no pasa nada pero cuando ago el estado sobre se ejecuta una animación

BOTONES DE SIMPLE
La manera más sencilla de crear botones con Flash es la creación de un objeto botón
Primero vistazo a este ejemplo de un objeto simple botón:




CREACIÓN DE UN BOTÓN 



Para crear un objeto botón, haga lo siguiente: 

1: Elija Insertar> Nuevo símbolo en el menú (o pulse Ctrl-F8) 

y la caja de Propiedades de símbolo aparece.

 A añade un nombre para el botón y hacer que la opción se selecciona el botón. 
2: Haga clic en Aceptar y se abrirá el Editor de botones. 

Como puede ver, se ve exactamente igual que el editor de Flash estándar, con una excepción: 

Sólo tiene cuatro cuadros en la línea de tiempo

3: Dibujar un botón de la manera que usted quiere que sea cuando no hay evento de ratón se detecta.
Tenga en cuenta que el marco activo se llama "Up" en la línea de tiempo.

4: Inserte un fotograma clave en el fotograma con la etiqueta "Más" en la línea de tiempo.
(Para hacer esto:. Haga clic en la capa 1 en la celda en blanco debajo de donde dice "Más" y luego pulse F6.)

5: Dibuja un botón de la manera que usted quisiera que fuera cuando un evento mouseover se detecta.

6: Inserte un fotograma clave en el fotograma con la etiqueta "Down" en la línea de tiempo.
(Para hacer esto:. Haga clic en la capa 1 en la celda en blanco debajo de donde dice "Down" A continuación,
 pulse F6.)

7: Dibujar un botón de la forma en que queremos que sea un evento de clic del ratón cuando se detecta.

T sombrero es - ha creado un botón con tres parece que va a cambiar en los eventos del ratón.

Tu todavía tienen que especificar en qué área se debe hacer clic, así como lo que debe suceder cuando se pulsa
el botón.
Proceder a aprender acerca de estos pasos.
La definición del área se puede hacer clic cuando se mueve el ratón sobre el botón visible

El último cuadro, llamado "Hit" es especial. Se trata simplemente de utilizar para especificar
el área que desencadena mousevents.
Si deja este cuadro en blanco - los acontecimientos después del ratón se activará cuando se mueve
 el ratón sobre el botón visible.
Pero si te toca un área que es más grande que el botón - entonces el evento de ratón se producirá
tan pronto como el ratón se vuelve aún junto a los botones. Por el contrario, se puede dibujar un área que
es más pequeño que el botón, de modo que los eventos del ratón sólo se activan cuando el ratón está en el centro del botón.

Sin embargo, el verdadero poder de la "Hit" marco es un poco más sofisticado.
Si se dibuja algo en la zona afectada que se encuentra fuera del área cubierta por el botón visible –
a continuación, el botón va a reaccionar a MouseEvents en la zona afectada. Eso significa que usted puede hacer
que algo suceda en una parte de la pantalla cuando el usuario mueve el ratón sobre otra parte de la pantalla.
Crear un Botón con Relieve
Crear un botón con efecto relieve de forma rectangular tipo formulario de manera rápida y sencilla.

Ejercicio paso a paso.
 

1 Dibujamos un rectángulo en el área de trabajo.
2 Seleccionamos el fondo.
3 Cambiamos el color de fondo del rectángulo. Por ejemplo a gris.
4 Con la herramienta texto escribimos el texto que queramos en el interior del rectángulo.

   Ahora que ya tenemos el molde, vamos a crear un sencillo efecto de relieve.
5 Seleccionamos los bordes izquierda y superior.
6 Modificamos el color de dichos bordes. Le damos el color blanco.
7 Seleccionamos ahora el borde inferior y aplicamos un color gris oscuro.
   Ya va tomando relieve, ahora vamos a crear los diferentes estados.
    
8 Seleccionamos el botón.
9 Activamos la opción de menú Insertar → Nuevo Símbolo.
10 Marcamos el comportamiento de botón y le damos un nombre Pulsa Aceptar.
11 Hacemos doble clic sobre el botón para editarlo.
12 Mediante F6 creamos fotogramas clave en cada uno de los fotogramas correspondientes
 a los estados del botón.


13 Seleccionamos el fotograma Presionado.
14 Modifiquemos ahora el borde inferior y el derecho del botón aplicándole el color blanco.
15 Finalmente seleccionemos los bordes superior e izquierdo y démosle el color negro.
 Respecto a los fotogramas Sobre y Zona activa, los dejaremos tal y como están puesto que no
deseamos que haga nada mientras no pulsemos el botón y el área de acción es la que comprende
 nuestro rectángulo.
 El resultado obtenido es el siguiente. Podemos pinchar sobre él y comprobar el efecto


.



 Puesto que existen multitud de acciones que se pueden aplicar tanto a los botones, como a otros elementos de Flash 8 vamos a comentar dos de las más comunes: 
Acciones en los botones 

1) Abrir una página web. Con esto conseguiremos abrir una página cualquiera de internet (o una película Flash), lo que nos servirá para irnos desplazando por webs que contengan más de una página, o permitir al usuario descargarse archivos entre otras cosas.

Para añadir una acción a un botón es necesario el uso de ActionScript (en el tema 17 se tratará con mayor profundidad).
Por lo tanto, los pasos a seguir serán los siguientes:
  1. Selecciona el botón haciendo clic sobre él, pues es a él al que irá asociada la acción.
  2. Abre el panel Acciones haciendo clic en su pestaña o desde el menú Ventana → Acciones.
  3. Haz clic en el botón Asistente de script.
  4. En el marco de la izquierda haz clic sobre Funciones globales → Navegador/Red → getURL.5
  5. Al seleccionar el comando getURL (que se encarga de crear un link a una página web) se mostrarán sus respectivas opciones en la derecha del panel. Rellena los campos URL con la página a la cual quieres vincular el botón y selecciona en que ventana quieres que se abra el link en el desplegable Ventana (_blank abrirá el link en una página nueva).
Cierra el panel de Acciones y el botón estará listo. Has añadido una acción a tu botón Aquí tienes una muestra de cómo hacerlo                                                                                                             Controlar una película en curso. Si estamos reproduciendo una película Flash y queremos permitir que el usuario la detenga, la ponga en marcha, avance, retroceda ...  
    Por ejemplo, para detener una película en curso simplemente debemos hacer que nuestro botón en cuestión aparezca en el escenario de dicha película, seleccionarlo, y abrir el panel de acciones, activando posteriormente la función Stop(). 




    Tras hacer esto, deberíamos cambiar como hicimos en la animación anterior 
el momento en el que se debe ejecutar la función, seleccionando el evento Presionar.
Arriba mostramos cómo debería quedar el panel de acciones del botón. 
Ahora cada vez que presionemos este botón se detendrá la película en la que está incluido.
De forma muy parecida actuaríamos para otras acciones de control.




Incluir sonido en un botón


 Si nuestras páginas van a tener sonido, el sonido en los botones es una parte fundamental.
Podemos hacer, por ejemplo que se activen sonidos al pulsar un botón.
  Para ello, simplemente debemos editar nuestro botón y seleccionar el fotograma Presionado.
Ahora debemos insertar el sonido. Por ejemplo podríamos importar uno desde nuestro disco duro o bien
 Tomar alguno que ya tengamos en la biblioteca.



No hay comentarios:

Publicar un comentario