Apache Adobe Flex TutorialTutoriaux Adobe Flex & AIR en Français

26août/090

Composant Flex – Menu avec Scroll vertical (et MenuBar, PopUpMenuButton)

Quand vous créez une application Flex, vous avez plusieurs moyens de faire apparaître des menus. Pour cela, il y a les composants MenuBar, PopUpMenuButton par exemple. Ces deux composants utilisent une classe de base la classe Menu. La classe Menu du framework peut être utilisée pour afficher des menus n'importe où dans votre application.

Seulement, les menus crées avec la classe Menu ne tiennent pas compte du nombre d'éléments dans un menu ou dans un sous-menu. Ainsi, si vous avez une grande quantité d'éléments et que la hauteur du menu est supérieure à la hauteur de votre application, vous ne verrez pas certains éléments et vous n'aurez aucun moyen d'y accéder (pas de défilement).

Doug McCune a pour cela crée un composant baptisé ScrollableMenu qui affiche des flèches de défilement et/ou des barres de défilement (scrollbar). Tous ces composants sont facilement personnalisables. Les composants ScrollableMenuBar et ScrollablePopUpMenuButton sont eux aussi inclus dans le projet et implémente le même comportement que le ScrollableMenu.

Voir la page officielle sur le blog de Doug McCune

Application de démonstration

Flex Source Code Download: Télécharger le code source complet de l'application

This movie requires Flash Player 11

4nov/080

Flex PopUpMenuButton – Ecouter les évènements Menu (MenuEvent)

Les composants Menu propagent des évènements itemClick de type mx.events.MenuEvent chaque fois que l'utilisateur sélectionne un item du menu. Vous pouvez écouter cet évènement directement depuis le menu en utilisant la méthode ActionScript addEventListener. Si vous utilisez PopUpMenuButton, vous pouvez écouter l'évènement itemClick directement depuis le bouton.
Vous pouvez même utiliser du MXML pour écouter cet event, comme illustré dans cet exemple qui modifie le label du bouton chaque fois que l'utilisateur fait une sélection:

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" viewSourceURL="srcview/index.html">
	<mx:PopUpMenuButton id="button" labelField="@label" itemClick="button.label = event.label">
		<mx:dataProvider>
			<mx:XMLListCollection>
				<mx:XMLList xmlns="">
					<item label="ActionScript">
						<item label="Classe"/>
						<item label="Interface"/>
					</item>
					<item label="MXML">
						<item label="Application"/>
						<item label="Component"/>
					</item>
				</mx:XMLList>
			</mx:XMLListCollection>
		</mx:dataProvider>
	</mx:PopUpMenuButton>
</mx:Application>

Flex Source Code Download: Télécharger le code source complet de l'application

This movie requires Flash Player 11

3nov/080

Flex PopUpMenuButton – Exemple simple de PopUpMenuButton en MXML

Le composant PopUpMenuButton simplifie l'association d'un menu avec un bouton en créant automatiquement le menu assigné au dataProvider du bouton.
Voici un exemple simple de son utilisation:

<mx:PopUpMenuButton labelField="@label">
	<mx:dataProvider>
		<mx:XMLListCollection>
			<mx:XMLList xmlns="">
				<item label="ActionScript">
					<item label="Classe"/>
					<item label="Interface"/>
				</item>
				<item label="MXML">
					<item label="Application"/>
					<item label="Component"/>
				</item>
			</mx:XMLList>
		</mx:XMLListCollection>
	</mx:dataProvider>
</mx:PopUpMenuButton>

Flex Source Code Download: Télécharger le code source complet de l'application

This movie requires Flash Player 11

Remplis sous: Exemple, MXML Lire la suite