[Flash 8.0] Didacticiel création d'un menu objet/xml (Etape 2) [Tutoriel]

CUCARACHA · 30/09/2006, 18h01

Salut,

Je reprends mon précédent Post sur lequel j'avais expliqué comment récupérer le 1er Niveau d'un Menu hiérarchique.

Méthode entièrement dynamique, tous les clips sont et seront créés par code (très pratique donc).

L'étape 2 consiste à rendre la procédure récursive pour que le nombre de menu ne soit plus limité, ni en nombre d'élément, ni en profondeur.

L'étape 3 consistera à permettre l'escamotage des fils d'un élément à la façon d'un arbre.

Je rappelle les éléments :

Source XML (J'y ai ajouté 1 niveau pour en obtenir 3)
Le fichier s'appelle Menus.xml
(Il sera remplacé plus tard par une page XML Dynamique ASP dot Net 2.0 C# (et peut-être VB Dot Net).

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
<Root_Element>
   <Menus>
      <Menu caption="Accueil" open="clpPannel001Accueil"/>
      <Menu caption="Tchat" open="clpPannel002Tchat"/>
      <Menu caption="Messagerie" open="clpPannel003Messagerie">
         <SousMenus>
            <Menu caption="Envoyés" open="clpPannel003Messagerie01"/>
            <Menu caption="Recus" open="clpPannel003Messagerie02">
               <SousMenus>
                  <Menu caption="Lus" open="clpPannel003Messagerie0201"/>
                  <Menu caption="NonLus" open="clpPannel003Messagerie0202"/>
               </SousMenus>
            </Menu>
         </SousMenus>
      </Menu>
      <Menu caption="A propos" open="clpPannel004APropos"/>
   </Menus>
</Root_Element>

Source de la classe menu qui hérite MovieClip
Le fichier s'appelle clMenu.as

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
 
/*
Class : clMenu
Auteur : Laurent Jordi
Modifée le : 24/09/2006
Copyright : Laurent Jordi
 
Description : La classe permet de définir un élément du menu dynamique
*/
class clMenu extends MovieClip 
{
	//Variables de liaison
	public static var id:String = "__Packages.clMenu";
    private static var _isSymbolLinked:Boolean = Object.registerClass(id, clMenu);	
 
	//Variables d'occurence privée
	private var __index:Number;
	private var __caption:String;
	private var __link:String;
	private var __childrenMenus:Array;
	private var __maxChildrenIndex:Number = -1;
	private var __previousMenu:MovieClip;
	//Constructeur
	//******************************************************
	public function clMenu() {
		var intTop:Number;
		var tf = this.createTextField("txtCaption",this.getNextHighestDepth(),0,intTop,this._parent._width,10);
		tf.autoSize = "left";
	}
	//******************************************************
	public function get index():Number {
		return this.__index;
	}
	public function set index(value:Number):Void {
		this.__index = value;
	}
	//******************************************************
	public function get caption():String {
		return this.__caption;
	}
	public function set caption(value:String):Void{
		this.__caption = value;
		//Mise à jour du champ texte
		this["txtCaption"].text = value;
	}
	//******************************************************
	public function get link():String {
		return this.__link;
	}	
	public function set link(value:String):Void{
		this.__link = value;
	}	
	//******************************************************
	public function get maxChildrenIndex():Number {
		return this.__maxChildrenIndex;
	}	
	public function set maxChildrenIndex(value:Number):Void{
		this.__maxChildrenIndex = value;
	}
	//******************************************************
	public function get previousMenu():MovieClip {
		return this.__previousMenu;
	}	
	public function set previousMenu(value:MovieClip):Void{
		this.__previousMenu = value;
	}
}

Source a mettre dans la première image d'un clip vide.
Le fichier s'appelle TestMenu.fla mais peut s'appeler comme vous voulez.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
 
import clMenu;
 
//Variables globales
var maxChildrenIndex:Number = -1;
var menuVerticalIndent = 0;
var menuHorizontalIndent = 15;
// Chargement du XML
var menuXML:XML = new XML();
var szSourceXLM:String = "Menus.xml"
menuXML.onLoad = menuXML_onLoad;
menuXML.ignoreWhite = true;
menuXML.load(szSourceXLM);
 
//Fonction récursive de parcours des frères d'un Node XML (récursion sur les sous menus)
function loadMenus(currentNode,parentMenu,yOffset,xOffset) {
	var currentMenu:MovieClip;
	var currentMenuName:String;
	var TMPprevMenuIndex:Number;
	while (currentNode!=null) {
		switch (currentNode.nodeName) {
		case "Menu": //Utilisation d'un switch pour une éventuelle évolution ultérieure
			parentMenu.maxChildrenIndex++;
			currentMenuName = "MenuItem" + parentMenu.maxChildrenIndex;
			currentMenu = parentMenu.attachMovie(clMenu.id,currentMenuName,parentMenu.getNextHighestDepth());
			currentMenu.index = parentMenu.maxChildrenIndex;
			currentMenu.caption = currentNode.attributes.caption;
			trace(currentMenu._height);
			if (_root.menuVerticalIndent==0) {_root.menuVerticalIndent = currentMenu.txtCaption._height}
			currentMenu.link = currentNode.attributes.open;
			if (currentMenu.index==0) {
				currentMenu.previousMenu = null;
				currentMenu._y = yOffset;
				trace(yOffset);
			} else {
				TMPprevMenuIndex = currentMenu.index - 1
				currentMenu.previousMenu = parentMenu["MenuItem" + TMPprevMenuIndex];
				currentMenu._y = currentMenu.previousMenu._y + currentMenu.previousMenu._height;
			}
			currentMenu._x = xOffset;
			switch (currentNode.childNodes[0].nodeName) {
			case "SousMenus":
                                                   //La fonction s'appelle elle même
				loadMenus(currentNode.childNodes[0].childNodes[0],currentMenu,_root.menuVerticalIndent,xOffset + _root.menuHorizontalIndent)
				break;
			}
			break;
		}
		currentNode = currentNode.nextSibling;
	}
}
 
//Appel de la récursion depuis l'évennement on Load de l'objet XML
function menuXML_onLoad(success) {
var cN;
	_root.createEmptyMovieClip("clpMainMenu01",1);
	var pM:MovieClip = _root["clpMainMenu01"];
	pM.maxChildrenIndex = -1;
	if (success) {
		cN = menuXML.firstChild.childNodes[0].childNodes[0]; // Liste des menus
		loadMenus(cN,pM,0,0);
	}
}

Voila... chez moi ça marche...

La suite la semaine prochaine (si j'ai le temps de m'en occuper...)

Vos commentaire sont bien entendu, les bienvenus...

@+

Laurent Jordi
Site CV
Ezlogic.mc

**jean philippe** · 30/09/2006, 18h20

salut
quelle est la question ?

CUCARACHA · 30/09/2006, 18h45

Salut

C'est pas une question c'est un didacticiel ouvert aux commentaires. Ces derniers permettront de l'améliorer. Au final, j'aimerais que le menu dynamique puisse :

Servir de plan de site en connectant directement au sitemap des projets ASP net 2.0
Servir de base à un site complexe en flash 8.0
Se connecter à une base de données pour extraire une vue hiérarchique d'une table

Si certains son preneur, le code est à leur disposition...

@+

Laurent

Concernant Flash 9.0 (et l'ajout de la nouvelle méthode de gestion des événements) je dois attendre de bosser du le produit licencié car Flash 9 ne marche pas avec la version d'essai.

**pyrrha** · 30/09/2006, 23h14

hello !
Est ce que l'on peut voir un exemple de ton menu final ?

sinon je te conseille également de te lancer dans l'AS3 dès que tu pourra, ca vas changer ta vie

Remarque : concernant le tag [expert] dans le sujet, je ne sait pas s'il est vraiment requis. Il n'y a rien de vraiment compliqués la-dedans

disons plutot intermediaire

CUCARACHA · 01/10/2006, 01h41

@+

laurent

**Heptaeon** · 01/10/2006, 09h38

Disons que c'est une approche plus de vrai codeur que de bidouilleur flash :p. Des fichier de code séparés, des objets, une encapsulation cohérente. Mais il est vrai qu'il y a rien de techniquement abusé ^^.

Par contre une question que je me pose. Quel est le but de faire précédé par _ ses variables ? en C c'est les nom réservé par le système, mais en flash ?

CUCARACHA · 01/10/2006, 10h14

Envoyé par pyrrha

hello !
Est ce que l'on peut voir un exemple de ton menu final ?

Mon menu final est utilisé dans une application hébergée que je suis en train de développer et que je ne peux pas trop montrer pour le moment.

Envoyé par pyrrha

sinon je te conseille également de te lancer dans l'AS3 dès que tu pourra, ca vas changer ta vie

J'en suis persuadé, en particulier grâce à la nouvelle gestion des événements. Je l'ai installé mais il n'est pas possible d'utiliser flash 9.0 avec la version d'évaluation de flash 8.0. Je devrais acheter la mise à jour flash 8 vers le 15 octobre.

Envoyé par pyrrha

Remarque : concernant le tag [expert] dans le sujet, je ne sais pas s'il est vraiment requis. Il n'y a rien de vraiment compliqués là-dedans

disons plutôt intermédiaire

J'ai supprimé le tag, vu ce que je vois tous les jours sur le terrain, il n'y a que peu de développeurs et en particulier de flasheurs qui programment (et qui pensent) réellement objet. Ce tag concernait plus l'approche et l'architecture final que le pur niveau de prog AS.

@+

Laurent Jordi

[Flash 8.0] Didacticiel création d'un menu objet/xml (Etape 2) [Tutoriel]

Flash

Vue hybride

Discussions similaires

Partager

Partager