El diseño es malo, porque no es lo importante de este ejemplo, si no mas bien la mejora al script, esta un poco tosco; pero quise hacerlo así para que en caso de ser necesario usaran la referencia del lenguaje de los tutoriales de este foro (introducción al lenguaje AS 1, 2 y 3) ademas de que como es la primera versión, pues vamos por abonitos.
Otra diferencia esta vez, es que todo el código del programa lo cargare directamente en una clase y es con la que trabajaremos, dejando el entorno libre para futuras actualizaciones, solo bastaría modificar el archivo "audio.js" en el bloc de notas y listo, así ya no dependeremos del FLA para la edición.
1.- Bien creamos una pelicula en blanco del tamaño que deseemos y creamos un diseño que nos agrade o el que sea para hacer pruebas.
2.- Creamos una barra con animacion de forma de 100 fotogramas (como las que usamos para los preloaders)
3.- Creamos 5 botones, stop_btn, play_btn, prev_btn, sigu_btn, volMenos_btn y volMas_btn.
4.- Creamos cuadro cuadros de texto dinamicos y les asignamos los siguientes nombres de instancia: ide_txt(El que mostrara la info de nuestro mp3), time_txt(el contador de tiempo), porcentaje_txt(mostrara el avance de la carga del mp3) y vol_txt (mostrara en que porcentaje se encuentra el volumen del archivo reproduciendo).
6.- Abrimos nuestro editor de ActionScript (F9) e insertamos el siguiente codigo:
7.- Creamos un nuevo documento de ActionScript directamente en flash o en cualquier editor de texto y le agregamos el siguiente código: (atención al código que en los comentarios explico como funciona)
//Inicio del archivo de audio
stop();
var i:Number = 1;
//contador del mp3
var v:Number = 40;
//variable para medir el volumen del audio
var mp3s:Number = 3;
//Maximo de mp3 a reproducir
_root.miMp3 = new Sound();
//variable principal mi mp3
_root.miMp3.loadSound("mp3/"+i+".mp3", true);
//hacemos la carga de mp3 segun el valor de i
_root.miMp3.setVolume(v);
//asigna el volumen de reproduccion
_root.miMp3.onSoundComplete = function() {
//cuando termine el mp3, cargamos el siguiente
i++;
if (i>mp3s) {
i = 1;
}
miMp3.loadSound("mp3/"+i+".mp3", true);
_root.vol.gotoAndStop(v)
};
miMp3.onload = function(success:Boolean) {
var totalSeconds:Number = this.position/1000;
//vemos el tiempo transcurrido y sacamos los segundos
var minutes:Number = Math.floor(totalSeconds/60);
//lo mismo y sacamos los minutos
var seconds = Math.floor(totalSeconds)%60;
if (seconds<10) {
seconds = "0"+seconds;
}
if (minutes<10) {
time_txt.text = ("0"+minutes+":"+seconds);
} else if (minutes>=10) {
time_txt.text = (minutes+":"+seconds);
}
};
setInterval(miMp3, "onload", 1000);
// lo que viene es para el porcentaje cargado
onEnterFrame = function () {
porcentaje_txt.text = (Math.round((miMp3.getBytesLoaded()/miMp3.getBytesTotal())*100)+"%");
if (Math.round((miMp3.getBytesLoaded()/miMp3.getBytesTotal())*100) == 100) {
porcentaje_txt.text = "streaming completo";
}
};
miMp3.onID3 = function():Void {
ide_txt.text = miMp3.id3.artist+" - "+miMp3.id3.songname;
};
//---------------------------------------
_root.vol_txt.text = "volumen a "+v+"%";
//Volumen inicial -----------------------
//funciones para el boton stop
_root.stop_btn.onPress = function() {
miMp3.stop();
miMp3.setVolume(v);
};
//funciones para el boton play
_root.play_btn.onPress = function() {
miMp3.start();
miMp3.setVolume(v);
};
//funciones para el el boton anterior
_root.prev_btn.onPress = function() {
if (i>1) {
//Condicion que asigna que si es mayor a 1
i = i-1;
//entonces sera igual a i restando 1
miMp3.loadSound("mp3/"+i+".mp3", true);
//cargara el valor de i
miMp3.setVolume(v);
//asigna el valor global del volumen
} else if (i<=3) {
//segunda condional que dice que si i es menor o igual a 3
i = 3;
//borre el valor anterior y asigne 3
miMp3.loadSound("mp3/"+i+".mp3", true);
//carga un mp3 con el valor de i
miMp3.setVolume(v);
//asigna el volumen global al archivo
}
/*En el anterior bloque de condiciones, creamos un bucle de forma manual, donde si i llega
a un valor menor a 1, si presionamos el boton seguira restando en 1, entonces creamos una
segunda condicion en la misma estructura donde si i no es menor o igual a 3, borre el valor
previo y re asigne a 3; con lo que obliga al programa a cumplir la primer condicion, creando
un bucle infinito en esta ecuacion.*/
};
//funciones para el boton siguiente
_root.sigu_btn.onPress = function() {
if (i<3) {
i = i+1;
miMp3.loadSound("mp3/"+i+".mp3", true);
miMp3.setVolume(v);
} else if (i>=3) {
i = 1;
miMp3.loadSound("mp3/"+i+".mp3", true);
miMp3.setVolume(v);
}
/*Hacemos lo mismo que en el boton anterior solo que a la inversa, aqui agregando valores en 1
en lugar de restarlos */
};
//funcion para el boton bajar volumen
_root.volMenos_btn.onPress = function() {
if (v>0) {
//creamos una condicion que dicte que si v es mayor a 0
v = v-5;
//el valor de v, sera v menos 5
miMp3.setVolume(v);
//asigna el volumen de la variable miMp3
_root.vol.gotoAndStop(v);
//lleva la barra de volumen al fotograma que dicte v
//en este caso se correra hasta 40; pues el valor original acertado
_root.vol_txt.text = "volumen a "+v+"%";
}
};
//funciones para el boton subir volumen
_root.volMas_btn.onPress = function() {
if (v<100) {
v = v+5;
miMp3.setVolume(v);
_root.vol.gotoAndStop(v);
_root.vol_txt.text = "volumen a "+v+"%";
}
};
//Fin del reproductor
/*MP3 Player by:
Sapinto: http://www.gallonegro.cl & Kitsch: http://javiernavarro.be | http://kitschmultimedia.info
*/
Bien espero que alguien le sea útil y mas aun, haber si alguien sale con algun aporte al tema y un dia de estos hacemos nuestro propio reproductor del foro.
Ver ejemplo del tutorial
Descargar Source del tutorial
Saludos
Este tema ha sido editado por elQuique: 02 octubre 2007 - 03:39

Conectar
Registrar
Ayuda


MultiCitas








