Notre fichier XML se prête de toute évidence à la création d'un menu dynamique. A nous donc de construire les éléments de Flash qui feront exister ce menu.

Créez un nouveau document dans Flash MX. Nous allons de suite réaliser le symbole qui accueillera nos liens: faites ctrl-F8 (ou pomme-F8) pour afficher la fenêtre de création de symbole. Nommez-le mc, donnez-lui un comportement de Clip, et dans les options avancées (bouton "Avancé"), donnez-lui une liaison "Exporter pour ActionScript" sous l'identifiant mc. Nous devons l'exporter car notre clip ne sera pas déposé à la main sur la scène, mais placé dynamiquement par ActionScript selon les besoins, comme nous l'avons déjà vu dans un précédent article. Validez, vous vous retrouvez sur la scène de votre Clip nouvellement constitué. Nommez le calque actuel rectangle, et créez-en un second, texte. Dans la première et seule image-clé de rectangle, créez un rectangle de 100*20 à l'aide de l'outil Rectangle. Alignez-le (ctrl/pomme-K) de telle sorte que son centre de gravité se situe en haut à gauche. Sur l'image-clé de texte, créez un champ texte dynamique sur une seule ligne, monTexte.

Il ne nous reste plus qu'à placer le code suivant sur l'image-clé du seul calque de notre scène principale (qui est donc vide):

menu_xml = new XML();
menu_xml.ignoreWhite = true;
//System.useCodePage = true;
menu_xml.onLoad = function()
  {
  noeuds = this.firstChild.childNodes;
  for (var i = 0; i < noeuds.length; i++)
    {
    lien = _root.attachMovie("mc", "mc" + i, i);
    lien._x = lien._width * i;
    lien._y = 0;
    lien.monTexte.text = noeuds[i].attributes.num + ":" + noeuds[i].firstChild.nodeValue;
    lien.adresse = noeuds[i].attributes.url;
    lien.onRelease = function()
      {
      getURL(this.adresse, "_blank");
      }
    }
  }
menu_xml.load("datas.xml");

Après avoir déclaré menu_xml comme étant une occurrence de l'objet XML(), et en préparation du chargement du document XML par la méthode load(), nous faisons appel à la propriété ignoreWhite, qui nous permet de ne pas nous préoccuper des noeuds textuels ne contenant que des espaces, et nous construisons notre fonction autour de l'événement onLoad().

Cette fonction crée un tableau (noeuds) de tous les noeuds du premier enfant de notre document XML, c'est à dire l'ensemble des noeuds contenus entre les balises <sites> et </sites>. On le comprend facilement, firstChild évalue la premier noeud de menu_xml (this), et childNodes renvoi un tableau contenant l'ensemble des noeuds inférieurs.

Nous utilisons ce tableau pour l'ensemble de notre application, et tout d'abord pour notre boucle qui affichera ces noeuds au fur et à mesure. Notre boucle for parcourt ce tableau dans toute sa longueur. Pour chaque noeud, est créée sur la scène une occurrence, nommée mc suivit de la valeur de l'itération i, dans un niveau égal à i. Nous plaçons, grâce aux propriétés _x et _y, notre clip sur la scène de telle sorte que les différents liens soient affichés côte à côte, et espacés de leur propre largeur.
Nous remplissons ensuite le champ monTexte contenu dans le clip avec la valeur de l'attribut num et la valeur du contenu du premier noeud. Nous déclarons adresse comme variable de notre clip, et lui assignons la valeur de l'attribut url.

Nous créons enfin une fonction autour de l'événement onRelease, qui se lance une fois que l'on clique sur notre occurrence: elle ouvrira le navigateur à l'adresse précisée dans notre variable adresse.

Notre fonction est terminée, il ne nous reste plus qu'à lancer la méthode load() et laisser la nature agir... Voici notre résultat.

Vous noterez que nous avons mis en commentaire la ligne System.useCodePage = true; . useCodePage ne nous servirait que si le fichier XML n'avait pas été sauvegardé au format Unicode, en faisant en sorte que Flash utilise l'encodage textuel du système sur lequel il est lancé (ce qui peut se révéler problématique pour peu que le système sur lequel votre animation est lancée ne comporte pas les caractères que vous utilisez...).

Nos fichiers sources se trouvent ici. Il ne tient qu'à vous d'utiliser les capacités XML de Flash à bon escient, et pourquoi pas utiliser un fichier XML dynamique créé à la volée par PHP à partir d'une base MySQL ?

Page 1 | 2