Discussion :

[georges_jung]

Bonjour,

J'utilise au sein de mon application un itemRenderer. Voici de manière simplifié mon code :

- La Composant contenant une liste qui utilise mon itemRenderer :

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
 
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">
 
  <mx:Script>
		<![CDATA[
 
			[Bindable] public var monBean:Bean;
 
		]]>
	</mx:Script>
 
  <mx:List id="myList"
					 dataProvider="{monBean.databean}"
					 textSelectedColor="{monBean.colorSelected}"
					 color="{monBean.colorUnselect}"
					 itemRenderer="{new ClassFactory(MyItemRenderer)}">
	</mx:List>
 
</mx:Canvas>

- Un apercu de la classe Bean :

Code :

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

1
2
3
4
5
6
7
8
9
10
 
[Bindable]
class Bean {
    private var colorSelected:uint;
    private var colorUnselect:uint;
    private var databean:ArrayCollection;
 
    /* Getter et setter des proprietes A et B*/
 
}

- Et enfin le code de mon itemRenderer :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml"
		 verticalScrollPolicy="off" horizontalScrollPolicy="off">
 
	<mx:Image id="img" source="@Embed('style/images/inte.png')" horizontalCenter="0" verticalCenter="0" width="30" height="30" />
	<mx:VBox width="100%" height="100%" verticalAlign="middle">
		<mx:Label id="myLabel" text="{data.title}" />
	</mx:VBox>
 
</mx:HBox>

Tout fonctionne correctement, mes données sont correctement affichées...

Je souhaiterais que lors d'un click sur un élément de ma liste le label de mon itemRenderer change de couleur (et prendre la propriété colorSelected de mon bean).

Car actuellement, le fait de changer la propriété textSelectedColor de la liste n'influe pas du tout sur l'itemRenderer (ce qui est logique).

Quelqu'un a une idée de la manière dont je doit m'y prendre ? Car je suis un peu perdu.

Merci.

[samy2525]

Bonjour, j'espere ke je ne vais pas dire des betises

ben normalement tu as un evenemnt de type ListEvent.itemClick ou un truc comme ca que tu peux ajouter à ton composant list

maintenant tu rajoute une fonction qui te donne le owner de ton itemRenderer en gros ddans ta classes itemRenderer tu rajoute

Code :

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

1
2
3
protected function get ownerAsList():List {
    return (this.owner as List);
}

apres tu rajoute un ecouteur à ton owner sur l'evenement ci-dessus

Code :

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

1
2
3
4
5
6
7
8
override public function set owner(value:DisplayObjectContainer):void {
			super.owner = value;
 
			if (! ownerAsList)
				return ;
 
ownerAsList.addEventListener(ListEvent.ITEM_CLICK, changeColorLabel);
}

Code :

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

1
2
3
4
5
 
private function changeColorLabel(anEvent : ListEvent):void
{
    myLabel.setstyle("selectedColor", ownerAsList.monBean.colorSelected)
}

je ne sais pas si ca va marcher mais le but c'est juste d'avoir une reference du owner dans ton itemRenderer comme tu peux acceder au propriétés et methodes public du owner

bon courage

[georges_jung]

merci samy2525 pour ta réponse très rapide,

Cependant, cela ne marche pas parfaitement. Suivant tes conseils j'ai modifié mon itemRenderer :

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
 
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml"
		 verticalScrollPolicy="off" horizontalScrollPolicy="off">
 
		 	<mx:Script>
		  <![CDATA[
			import mx.events.ListEvent;
			import mx.controls.List;
 
			protected function get ownerAsList():List {
 			   return (this.owner as List);
			}
 
			override public function set owner(value:DisplayObjectContainer):void {
				super.owner = value;
				if(!ownerAsList)
					return;
			 	ownerAsList.addEventListener(ListEvent.ITEM_CLICK,changeColor);
			}	
 
			protected function changeColor(anEvent : ListEvent):void {
				  myLabel.setStyle("color",0xFF0000);
			}
		]]>
	</mx:Script>
 
	<mx:Image id="img" source="@Embed('style/images/inte.png')" horizontalCenter="0" verticalCenter="0" width="30" height="30" />
	<mx:VBox width="100%" height="100%" verticalAlign="middle">
		<mx:Label id="myLabel" text="{data.title}" />
	</mx:VBox>
 
</mx:HBox>

Remarque : j'ai mis setStyle("color",...) au lieu de selectedColor.

Cependant, lorsque je clique maintenant sur un item de ma liste, tous les labels changent de couleur. Or je souhaiterai que seul l'item sélectionné change de couleur.

De plus, je ne sais pas comment passer mon objet Bean à l'itemRenderer.

Merci encore

[samy2525]

en faite, j'ai oublié de te dire de rajouté ce test dans la fonction changeColor

Code :

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

1
2
3
4
5
6
7
8
9
 
private function changeColorLabel(anEvent : ListEvent):void
{
   if (data == anEvent.itemRenderer.data)
{
   myLabel.setstyle("color", ownerAsList.monBean.colorSelected)
} 
 
}

aussi de mémoire il me semble qu'il faut rajouter le set data qui contient les information de la ligne en cours

Code :

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

1
2
3
4
5
override public function set data(value:Object):void {
 
	super.data = value;
 
}

avec ça je pense que ça devrai aller, par contre je ne comprends pas pourquoi tu veux passer le bean à ton itemRenderer du moment où tu possede une reference sur l'objet qui contient l'itemRenderer tu peux facilement accéder à ses propriéts public, sauf si j'ai pas bien compris ta demande !!!

bon courage

[georges_jung]

Merci encore pour tes conseils...Tout fonctionne comme je le souhaite

[georges_jung]

Autre petite question, y-a t'il la possibilité que mon listener ne se fasse pas sur un CLICK sur un item mais lorsque le selectedIndex de ma liste change ?