Discussion :

[viking1404]

Bonjour,

je dois développer une application en flex. C'est la première fois que j'utilise cette technologie.
J'ai débord commencé par définir toutes mes interfaces. Maintenant je dois les rendre "vivante" en y ajoutant de l'actionScript.
Je suis en train tester sur une de mes vue mais, je ne comprend pas pourquoi ça ne fonctionne pas.

Je vous montre mon code, je vous expliquerai ce que je veux faire a la fin de ce message.

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
 
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#A1CCED, #FFFFFF]" width="1000" height="700">
 
	<mx:Script>
		<![CDATA[
			import mx.collections.ArrayCollection;
			import mx.events.ItemClickEvent;
 
			[bindable]
			public var myArray:ArrayCollection = new ArrayCollection([]);
 
			public var listeCommande:ArrayCollection = new ArrayCollection(["Commande 1","Nouvelle commande"]);
			public var commande1:ArrayCollection = new ArrayCollection(["Léoville Las Cases","Léoville Barteau","Léoville","Petrus","Petrus"]);
			public var nouvelleCommande:ArrayCollection = new ArrayCollection([]);
 
			myArray = Commande1;
 
			liste.dataProvider = myArray;
			toggleButtonBar.dataProvider = listeCommande;
 
			public static function clickHandler(event:ItemClickEvent):void 
			{
				if(event.label == "Comande 1")
				{
					myArray = Commande1;
				}
				else
				{
					myArray = nouvelleCommande;
				}
			}
		]]>
	</mx:Script>
 
	<mx:HBox width="100%" height="585" horizontalAlign="left" verticalAlign="middle">
		<mx:ToggleButtonBar id="toggleButtonBar"  itemClick="clickHandler(event);"  selectedIndex="0" direction="vertical" width="239" height="196" fontSize="18"/>
 
		<mx:HRule width="70" height="0"/>
 
		<mx:List id="liste" editable="false" width="483" labelField="libelle" height="456" fontWeight="bold" fontSize="20" textAlign="center"/>
	</mx:HBox>
 
	<mx:HBox width="100%" height="50">
		<mx:HRule width="706" height="0"/>
		<mx:Button label="Valider" width="180" height="50" cornerRadius="5" themeColor="#546D7C" fillAlphas="[0.8, 1.0, 0.5, 0.5]" fillColors="[#F9C2C2, #FF8181]" fontSize="20"/>
	</mx:HBox>
 
</mx:WindowedApplication>

Si vous executez ce petit bout de code vous voyez une toggleButtonBar verticale avec deux boutons. A sa droitre une liste et en dessous un bouton.

J'aimerais changer le contenu de la liste en fonction du bouton de la toggleBouttonBar. Si on clique sur le premier bouton, la liste à un contenu, si on clique sur le deuxième bouton, le contenu de la liste change.
Si j'utilise une toggleButtonBar c'est parceque je vais être amené à avoir bien plus que deux boutons

A priori rien d'extraordinaire, sauf que je n'ai encore jamais utilisé ce paradigme et je suis un peu dérouté.

Merci beaucoup.

[omar simpson]

salut viking,

en partant de ton exemple j'ai fait quelques modifs (je n'avais pas le temps pour compiler une appli AIR, mais le code est en mxml, et tu devrais pouvoir t'en sortir)

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
 
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
	layout="vertical"
	creationComplete="myArray = commandes1"
	>
 
	<mx:Script>
		<![CDATA[
			import mx.collections.ArrayCollection;
			import mx.events.ItemClickEvent;
 
			[Bindable]
			public var myArray:ArrayCollection;
 
			[Bindable]
			protected var menu:ArrayCollection = new ArrayCollection([
				"Liste 1",
				"Liste 2"]);
 
			protected var commandes1:ArrayCollection = new ArrayCollection([
				{libelle: "Fichier"},
				{libelle: "Edition"},
				{libelle: "Affichage"}]);
 
			protected var commandes2:ArrayCollection = new ArrayCollection([
				{libelle: "Option"},
				{libelle: "Aide"},
				{libelle: "A propos"}]);
 
			private function clickHandler(event:ItemClickEvent):void {
				event.index == 0 ? myArray = commandes1 : myArray = commandes2;
			}
		]]>
	</mx:Script>
 
	<mx:HBox width="100%" height="100%"
		horizontalAlign="left"
		verticalAlign="middle">
 
		<mx:ToggleButtonBar id="toggleButtonBar"
			itemClick="clickHandler(event);"
			direction="vertical"
			dataProvider="{menu}" />
 
		<mx:List id="liste"
			dataProvider="{myArray}"
			width="100%" height="100%"
			editable="false"
			labelField="libelle"  />
	</mx:HBox>
 
	<mx:HBox width="100%" height="50">
		<mx:Button label="Valider" />
	</mx:HBox>
 
</mx:Application>

En espérant que cela t'aidera

[viking1404]

Merci, ton code fonctionne très bien

Cela m'a permis de bien avancer !
Mais, je ne comprenais pas pourquoi mon code ne fonctionnais pas. Il n'y a pas tant de différences avec le tient.

J'ai fini par avoir une réponse (peut être pas la seule, je n'ai pas essayé) : le métacode "Bindable", je l'ai écrit avec un b minuscule !

Désole d'avoir posté un message pour une con***** pareille, je ne suis pas près de recommencé mon erreur

Encore merci.