TUTORIELS 
Flash MX : un lecteur MP3 utilisant XML

Page 1 | 2

Envie d'une radio pour votre site ? Cet article vous donne les premiers outils, en combinant la simplicité du XML avec la puissance de Flash MX.
 (4 décembre 2003)
 
Nous continuons ici notre série sur la gestion de XML par Flash : après avoir réalisé une galerie photo avec Flash et XML, nous abordons ici un autre média, le son, ce qui va nous permettre de toucher à l'objet Sound(). Nous afficherons nos titres dans une liste, grâce au composant ListBox.
Notez que nous irons ici à l'essentiel : il ne tient qu'à vous d'ajouter des fonctions à notre lecteur (préchargement, boutons suivants/précédents...).


Présentation du fichier XML
Nous exploiterons un fichier XML, playlist.xml, de cette forme :

<?xml version="1.0" encoding="iso-8859-1"?>
  <playlist>
    <chanson num="01" nom="Boqwist" fichier="boqwist.mp3" />
    <chanson num="02" nom="Giorbino" fichier="giorbino.mp3" />
    <chanson num="03" nom="Interlope" fichier="interlope.mp3" />
    <chanson num="04" nom="Pastorlange" fichier="pastor.mp3" />
  </playlist>

Nous partons ici du principe que le SWF, le XML et les MP3 se trouvent tous dans le même répertoire. Le cas échéant, il faut évidemment mettre à niveau les chemins...

Mise en place
Nous allons maintenant travailler uniquement dans Flash MX. Ouvrez la liste des composants (Ctrl-F7), et glissez un ListBox et un PushButton sur la scène (image 1 du calque "interface"). Nommez-les respectivement "liste" et "boutonStop".
Ajoutez à cela un champ texte dynamique (avec bordure si vous le souhaitez), avec pour nom de variable ecranTitre. Agencez ces trois éléments comme vous le souhaites (faites en sorte d'avoir une liste et un champ suffisamment larges...). Nous en avons terminé avec l'interface.

Le code
Le code est situé sur l'image 1 du calque "actions".
Il nous faut ici gérer plusieurs éléments et actions. Nous allons vous en donner les morceaux de code un à un.

Gestion du XML
playlist_xml = new XML();
playlist_xml.ignoreWhite = true;
playlist_xml.onLoad = function(ok)
  {
  if (ok = true)
    {
    playliste = this.firstChild.childNodes;
    premiere = this.firstChild.firstChild;
    enCours = premiere;

    for (i = 0; i < playliste.length; i++)
      {
      liste.addItem(enCours.attributes.num + ": " + enCours.attributes.nom, enCours.attributes.fichier);
      enCours = enCours.nextSibling;
      }
    }
  };
playlist_xml.load("playlist.xml");

Forums
* Discutez en sur les forums

Nous avons déjà vu dans notre article précédent le chargement d'un fichier XML, donc il ne devrait pas y avoir de surprises ici. Nous récupèrons l'ensemble de noeuds de notre liste dans le tableau playliste, et nous placons le premier noeud dans premiere, qui défini aussi enCours, notre "pointeur" vers le noeud en cours "d'exploration".
Dans notre boucle for(), nous remplissons notre ListBox à l'aide de la méthode .addItem(etiquette, donnee), où nous prennons pour étiquette le contenu des attributs num et nom du noeud XML en cours, et pour donnee le contenu de son attribut fichier.


Page 1 | 2

 
[ Xavier BorderieJDNet
 
Accueil | Haut de page