|
|
|
|
TUTORIEL FLASH |
|
|
|
Réalisez un lecteur mp3 en Flash |
Etape par étape, apprenez à concevoir et mettre en forme un lecteur léger. Au menu : lecture, arrêt, pause et indications visuelles du temps écoulé.
(10/01/2006) |
|
Cinq fonctions sont à mettre en place : jouer(),
pauser() et arreter()
bien sûr, mais également majTxt(),
qui sera appellée à intervalle régulier pour mettre à jour les
informations de lecture affichée, et une fonction attachée
à chanson.onSoundComplete, qui
lancera arreter() lorsque la
chanson se termine. Commençons par ces deux dernières :
chanson.onSoundComplete = function()
{
_root.arreter();
};
function arreter() {
chanson.stop();
clearInterval(si);
decalage = 0;
barrePlaying._width = 0;
_root.txt.text = "0/"+duree+" - 0%";
}
La première
est donc simplement un renvoi vers arreter()
(onSoundComplete est un évènement
qui se lance quand la chanson est terminée), afin de
ne pas créer de doublon inutile, tandis que cette dernière réinitialise
nombre de paramètres : elle arrête la chanson, retire l'intervalle,
met à zéro la valeur de décalage ainsi que la largeur
de la barre de lecture, et fait refléter l'ensemble par le texte.
pauser() n'est guère plus compliquée
:
function pauser() {
clearInterval(si);
chanson.stop();
}
Littéralement, elle stoppe l'intervalle de mesure, ainsi que
la chanson. Par contre, elle ne réinitialise par les autres
variables : la chanson est censée pouvoir reprendre là où elle
s'est arrêtée.
majTxt() est notre centre d'informations
:
function majTxt() {
pc = Math.round((chanson.position*100)/chanson.duration);
txt.text = Math.round(chanson.position/1000)+"/"+duree;
txt.text += " - "+pc+"%";
barrePlaying._width = pc;
decalage = chanson.position/1000;
}
On y calcule le pourcentage de chanson joué (stocké dans la
variable pc), et on inscrit
ce pourcentage ainsi que le nombre de secondes écoulées dans
le champ texte. Par ailleurs, cette fonction étant lancée
périodiquement, on en profite pour y récupérer la valeur de
décalage, à partir de la propriété position
de chanson.
À noter que decalage doit être
exprimé en seconde, tandis que position
(tout comme duration) l'est
en millisecondes : des calculs s'imposent donc ici.
Enfin, le cur de notre lecteur, jouer()
:
function jouer() {
if (charge == false) {
chanson.onLoad = function(ok) {
txt.text = "Chargement...";
if (ok=true) {
charge = true;
duree = Math.round(chanson.duration/1000);
txt.text = "0/"+duree+"
- 0%";
chanson.start();
si = setInterval(majTxt,
1000);
}
};
chanson.loadSound(fichier, true);
} else {
chanson.start(decalage);
si = setInterval(majTxt, 1000);
}
}
Son comportement est différent selon que le fichier a été chargé
ou pas. Dans le premier cas, cela signifie que nous sommes certainement
en pause : on appelle donc simplement la méthode start()
en lui indiquant le décalage voulu, et on relance l'intervalle,
stoppée précédemment.
Dans le second cas, on commence par définir le gestionnaire
d'évènement onLoad. Dès que
celui-ci renvoie true (donc
dès que le fichier est chargé), on passe la variable charge
à true, et l'on met en place
le reste : calcul de la durée totale, inscription dans le champ
texte, lancement de la chanson, lancement de l'intervalle.
Enfin, et seulement après avoir défini onLoad,
on appel effectivement la méthode loadSound(),
qui chargera notre fichier - le chemin d'accès de ce dernier
sera contenu dans la variable fichier.
|
Forum |
|
Réagissez
dans les forums
de JDN Développeurs
|
Voici donc un lecteur mp3 minimal : notre version finale pèse 1 209 octets. N'oubliez pas que si
vous avez par erreur mis en place des composants Macromedia,
leur triste mémoire perdurera jusque dans votre SWF. Sauvez votre
FLA sous un nom différent, et compilez-le : vous devriez obtenir
une taille plus décente. Il vous reste à habiller correctement
ce lecteur, sans trop de fioritures...
|
|
|
|
|
|
Quand achetez-vous le plus en ligne ? |
|
|
|
|
|
|
|
|