Comunidad de diseño web y desarrollo en internet online

Boton Play-Pausa para sonido en flash

Creamos un nuevo documento y vamos a Insert > New Simbol y seleccionamos “Movie Clip” y después en el botón “Ok”, en la pantalla que nos apareció para la edición de nuestro Movie Clip que usaremos como botón, creamos dos Frames en blanco, seleccionando el Frame y presionando F6

frames

En el primer Frame pondremos el estado de “play” y en el Frame 2 pondremos el estado de “pause”, así que hagamos dos símbolos que indiquen lo anterior; cada uno en su respectivo Frame


Ahora en el panel de propiedades, a cada Frame le ponemos un “label” para hacer referencia a ellos; al primero le ponemos “play” y al segundo “pause”.

Ahora si vamos al escenario principal y desde la biblioteca arrastramos el Movie Clip que acabamos de crear y le ponemos el siguiente nombre de instancia: “Boton_btn”


El sonido.


Ahora vamos a File > Import > Import to Stage…

En el cuadro de dialogo que aparece seleccionamos nuestro sonido que queremos importar a nuestra librería.

Después vamos a nuestra librería, y buscamos nuestro nuevo sonido, una ves ubicado, damos clic derecho sobre él y vamos a la opción Linkage…; en el cuadro que nos aparece, marcamos: Export for ActionScript y después presionamos “Ok”, y si así lo deseamos, podemos cambiar el nombre con el cuál vamos a identificarlo en el código, en mi caso lo cambie a “Sonido”.

Enseguida vamos al primer Frame y ponemos el siguiente código:

/* Primero declaramos dos variables, pausa y estado; pausa nos servirá
para almacenar la posición donde esta la canción, y estado para saber en que
estado se encuentra la canción, 1 si el sonido se está reproduciendo y 0 para el 
estado en que el sonido esté en pause*/
var pausa:Number = 0;
var estado:Number = 0;
/* Como no le pusimos ninguna acción al Movie Clip, para que no se reprodujera
como loco, lo frenamos al comienzo*/
Boton_btn.stop();
/*Atachamos inmediatamente el sonido linkeado desde la biblioteca a una variable
llamada: "misonido"*/
_root.onLoad = function(){
    misonido = new Sound();
    misonido.attachSound("Sonido");
}
//En el evento onPress ó cuando presione el botón
Boton_btn.onPress = function (){
    if (estado == 0){
        /* se verifica en que estado se encuentra el sonido, si está en 0, ósea el sonido no se esta reproduciendo,
        ponemos play al sonido; usamos la variable de pausa que contiene
        lo que lleva la canción reproducida hasta el momento en milisegundos, por eso lo dividimos entre 1000;
        para que nos de exactamente la posición donde se encuentra*/
        misonido.start(pausa/1000);
        //Una vez el sonido en play, cambiamos el estado a 1, ósea reproduciéndose
        estado = 1;
        //y finalmente cambiamos la apariencia del botón
        Boton_btn.gotoAndStop("pause");
    } else {
        /*En caso de que no sea 0, significa que se esta reproduciendo la canción y 
        queremos detenerla, primero calculamos la posición donde se va a quedar en pause
        almacenándolo en la variable pausa*/
        pausa = misonido.position;
        //detenemos totalmente el sonido
        misonido.stop();
        //cambiamos el estado a 0, ósea sin sonido
        estado = 0;
        //y finalmente cambiamos la apariencia del botón
        Boton_btn.gotoAndStop("play");
    }
}

Y es todo, LISTO!! Ya tienen su botón play/pause en uno, uiiiiiiii!.

Conclusión:

Pues el código es bastante sencillo, no tiene mucha complicaciones, recuerden siempre comenzar sin sonido, por favor no sorprendan a nadie con el sonido a todo volumen al entrar a su Web, utilícenlo sabiamente U_U.

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Publica tu comentario

El autor de este artículo ha cerrado los comentarios. Si tienes preguntas o comentarios, puedes hacerlos en el foro

Entra al foro y participa en la discusión

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate