Menubar, interaction sur les menus de base

  • warning: array_map(): Argument #2 should be an array in /var/www/titouille.ch/www/modules/system/system.module on line 1050.
  • warning: array_keys() expects parameter 1 to be array, null given in /var/www/titouille.ch/www/includes/theme.inc on line 1845.
  • warning: Invalid argument supplied for foreach() in /var/www/titouille.ch/www/includes/theme.inc on line 1845.
Portrait de titouille
Soumis par titouille le mer, 08/31/2005 - 12:38

ça fait quelques temps déjà que j'ai vu cette question posée sur différents forums :

Comment, lorsqu'on implémente un composant Menubar, faire interagir un élément de menu de base. C'est à dire faire un menu qui ne se déroule pas, mais dont les menus permettent de faire des actions.

Je n'ai pas creusé le principe très loin, je pense qu'il y a encore des possibilités pour améliorer par exemple la gestion du focus, mais il y a là déjà un début de piste pour tout ceux qui veulent un menu sans sous-menus.

En fait, l'astuce est assez simple : Lorsqu'on ajoute un menu à une MenuBar, le composant se rajoute un élément en le nommant mbItemXXX, XXX commençant à 200.
Donc si je rajoute 4 éléments, j'aurai 4 items aux adresses mbItem200, mbItem201, mbItem202 et enfin mbItem203.
Ces éléments sont des movieClips, on s'en doute. Donc qui dit movieClips dit comportements, gestionnaires d'évenements, etc... et la suite, vous devez déjà l'entrevoir Smile

En fait, prenez un nouveau fla, ajoutez un composant MenuBar dans sa bibliothèque et collez le code suivant sur la scène :

// création de la barre
menubar = createClassObject( mx.controls.MenuBar, 'menubar', 10 );
menubar.setSize( 300, 22 );
menubar.move( 0, 20 );
//
// ajout des menus
menu = menubar.addMenu( 'test 1' );
menu = menubar.addMenu( 'test 2' );
//
// récupération des menus
item1 = menubar.mbItem200;
item2 = menubar.mbItem201;
//
// ajout d'un "type" pour 
// implémenter un switch dans les
// gestionnaires press et release
item1.type = 'first';
item2.type = 'second';
//
// affectation des gestionnaires
item1.onPress = down;
item2.onPress = down;
item1.onRelease = up;
item2.onRelease = up;
//
// gestionnaires
function down(){trace( 'down:'+this.type );}
function up(){trace( 'up:'+this.type );}

Je vous accorde que la récupération des différents items n'est pas très "recherchée". On peut tout a fait imaginer avoir une liste d'éléments à créer en tant que menu et faire des choses plus propres, exemple :

rajoutez un composant Alert dans votre bibliothèque et remplacez le code précédent par le suivant :

import mx.controls.Alert;
import mx.controls.MenuBar;
//
// création de la barre
menubar = createClassObject( MenuBar, 'menubar', 10 );
menubar.setSize( 300, 22 );
menubar.move( 0, 20 );
//
// liste d'éléments :
var tab:Array = [
	{ data:0, label:'google', url:'http://www.google.ch', type:'html' },
	{ data:1, label:'yahoo', url:'http://www.yahoo.fr', type:'html' },
	{ data:2, label:'lycos', url:'http://www.lycos.fr', type:'html' },
	{ data:3, label:'sabugo', url:'http://www.sabugo.ch', type:'alert' }
	];
//
// ajout des menus
var tabL:Number = tab.length;
for( var i:Number = 0; i < tabL; i++ )
	{
	menubar.addMenu( tab[i].label );
	var item = menubar['mbItem' + (200 + i)];
	item.index = i;
	item.onPress = function()
		{
		var item = tab[this.index];
		switch( item.type )
			{
			case 'html' :
				getURL( item.url );
				break;
			case 'alert' :
				var wnd = Alert.show("Naviguez à l'adresse " + 
					item.url + " pour de plus amples informations", 
					item.label, Alert.OK, this, undefined, "");
				wnd.move( 100, 100 );
				break;
			}
		trace( tab[this.index].url );
		}
	}

Maintenant, à vous de jouer pour remanier vos menus dans cette optique, amusez-vous bien Wink