Taller Webmaster

Tutoriales para Webmasters

Bienvenido a Taller Webmaster, donde encontrarás la mejor información sobre tutoriales y recursos para webmasters!

Ingreso de Usuario

Recuperar contraseña

Registro de Usuario

Publicidad

Botón de sonido Stop y Play en Adobe Flash

Adobe Flash y ActionScript

 

Tutorial por Jorge Oyhenard (elQuique)

Veremos como crear un sencillo botón para iniciar o detener una melodía utilizando Adobe Flash. Este botón podrá luego ser copiado en nuestros otros flash para reutilizarlo.

Esta opción es muy a la carrera y la uso para salir del paso rápidamente en algunas ocasiones y se puede mejorar, pero lo bueno es la sencillez de implementación.

1) Creamos una película nueva de 22 x 22px

Propiedades del Documento Sonido Play Stop

2) Dibujamos 2 iconitos con las herramientas de dibujo de Adobe Flash u otro vectorial y los incluimos en nuestra Library (Biblioteca, se ve con F11)

3) Incluimos un sonido MP3 también en nuestra Biblioteca, lo podemos arrastrar desde nuestro disco duro a la Biblioteca, controlar el peso por favor jeje

Biblioteca de Sonido y Botones

4) En la línea del tiempo vamos a nombrar el layer 1 (la capa 1) como "sonidos"

5) Con F5 vamos a agregar frames (fotogramas) hasta el 10

6) En el frame 6 (fotograma) vamos a agregar un KeyFrame (fotograma clave) con F6

7) Nos posicionamos en el frame 1 (fotograma) y arrastramos al espacio de trabajo el sonido desde nuestra Library (Biblioteca)

Insertar Sonido

8) Vamos a agregar un nuevo layer (capa), con botón derecho Insert, Layer (Insertar, Capa)

9) A ese layer (capa) le daremos el nombre botones

10) En el frame 1 (fotograma) vamos a arrastrar nuestro icono de sonido Off (el tachado Sonrisa)

11) En el frame 6 (fotograma) vamos a arrastrar nuestro icono de sonido On

Capa de Botones

12) Vamos a ir al frame 1 (fotograma 1) y vamos a seleccionar ese gráfico del sonido off, con F8 vamos a convertirlo en un nuevo símbolo tipo botón, al que le daremos de nombre btnStop

Crear Boton Stop

13) En el frame 6 (fotograma 6), seleccionamos el símbolo de sonido on, y con F8 lo convertimos en botón que llamaremos btnPlay

Crear Boton Play

14) Con esto completamos el aspecto gráfico de nuestra botonera de sonido, ahora vamos a realizar la programación que sera realmente poca Sonrisa. Insertamos un nuevo layer (capa) que nombraremos acciones.

15) En el layer (capa) acciones, en el frame 1 (fotograma 1) vamos a crear un keyframe (fotograma clave), y lo mismo en el frame 5, y en el frame 6, y lo mismo en el frame 10. (imagen abajo)

16) Para facilitar el entendimiento al frame 1 le daremos de nombre "comenzarsonido". (imagen abajo)

17) Y al frame 6 le daremos el nombre "pararsonido"

Capa de Acciones

18) Vamos ahora a la programación, en el frame 5 activaremos el cuadro de acciones (con F9) y vamos a escribir un stop(); La idea de esto es que la película se detendrá ahí, pero no así el sonido que permanecerá sonando hasta que le indiquemos lo contrario.

Accion Stop Frame 5

19) Vamos ahora al frame 6 y en el cuadro de acciones escribiremos stopAllSounds(); esta sera la orden para que se apague el sonido cuando lo llamemos con el botón

Accion StopAllSounds Frame 6

20) En el frame 10, programaremos otro stop() para que la película se detenga ahí, tal como hacíamos en el otro caso.

21) Ahora solo nos resta programar los 2 botones de nuestra aplicación que son los que nos darán el control de sonido.

22) Vamos a ir al frame 1, y vamos a seleccionar el botón llamado btnStop en nuestro espacio de trabajo, y en el cuadro de acciones programaremos el evento on (release) que se ejecuta cuando presionamos y soltamos el mouse (o sea al dar click), la acción sera gotoAndPlay("pararsonido"); lo que hace esto es ir hasta el frame pararsonido o sea el frame 6 que recordemos que tiene un stopAllSounds(); como vimos en el punto 19 del tutorial, esto logra apagar el sonido Sonrisa

Accion parar sonido boton stop

23) Ahora vamos al frame 6 y seleccionamos el botón llamado btnPlay y en las acciones le programamos el evento on (release) para que envíe hasta el frame "comenzarsonido" con la orden gotoAndPlay("comenzarsonido"); que recuerden es el frame 1 y como en la capa sonido es donde esta el audio a partir del frame 1, comenzara a sonar de nuevo nuestro audio Sonrisa

Accion comenzar sonido Boton Play

Ejemplo:

Puedes descargar el archivo FLA, desde acá: Archivo Fla

Comentarios de Botón de sonido Stop y Play en Adobe Flash

↑ Tutorial

  • lifter

    lifter

    2007-07-07 14:32

    Excelente este tutorial.... me ayudo demasiado... realmente agradecido..... puesto que en otros foros lab,,, nadie pudo decirme como se hacia.. asi que mil gracis
  • 33799045

    33799045

    2008-02-24 06:27

    muy buen tutorial lo hice y quedo joya gracias capo , si me podes decir como subo un archivo a sta web subo el mio al cual le hice una animacion al boton (mientras suena), Gracias
    T!ncho
  • JCMH

    JCMH

    2008-04-07 17:01

    Fenomenal pero como se copia en nuestros otros flash para reutilizarlo.
  • gaby_hash

    gaby_hash

    2009-08-09 14:47

    ah!!! lo maximo =D muchas gracias. buen tutorial :D
  • lack268

    lack268

    2009-10-25 02:30

    Que buen tutorial gracias muy entendible y facil de hacer
  • pablo_grafico

    pablo_grafico

    2010-03-20 12:40

    EXELENTE, MUCHAS GRACIAS!