Is a Flex list control larger than a string?
I have a list control where I want to show a string (that's fine) but a colored square.
Imagine that I have a "add player" button with text input with a choice of colors. I want to see the name of the color + player in the list. How can i do this?
[Bindable]
public var data:ArrayCollection = new ArrayCollection();
<mx:List id="eqlist" width="100%" dataProvider="{data}" />
data.addItem(fooTxt.text);
This code will only add text value, should I add an hbox object consisting of color canvas + text value?
Thank,
+1
source to share
1 answer
You need to work with List itemRenderers. Basically the rendering of a list item (ListItemRenderer) does not support a different background color for each item (the back color can only be set on the parent list).
Example (MXML version is not my favorite way, but the simplest one):
Data provider initialization:
var anObject: Object = new Object();
anObject.label = "my player";
anObject.backgroundColor = 0xFF0000;
anObject.color = 0xFFFFFF;
aData.addItem(anObject);
anObject = new Object();
anObject.label = "my player 2";
anObject.backgroundColor = 0x0000FF;
anObject.color = 0xAAAAAA;
aData.addItem(anObject);
List display:
<mx:List id="eqlist" width="100%" dataProvider="{aData}" >
<mx:itemRenderer>
<mx:Component>
<mx:Canvas backgroundColor="{data.backgroundColor}"
color="{data.color}">
<mx:Label text="{data.label}">
</mx:Label>
</mx:Canvas>
</mx:Component>
</mx:itemRenderer>
</mx:List>
+7
source to share