Flex TileList with associative array

Question

I have an associative array that I want to display using TileList. However, it doesn't understand what is being fed to it. All I got is [object] in the TileList.

[bindable]
public var people as array = new array();

private function loadArray():void{
people = decoded JSON array
showPeople.dataProvider = people;}

<mx:Tilelist id="showPeople" labelField="{data.name}" iconField="{data.imgURL}"/>

I tried using the mx:itemRender but it will only render one and only one item, ie either the string of the person's name or the image of the url. The end goal is to have the TileList show a person's picture using the URL from the array along with their name as the label. Any suggestion?

And the array looks like this 'name' => string of a person's name 'img' => string of the img URL

Answer 1

You should use a custom item renderer, like this one:

<mx:itemRenderer>
  <mx:Component>
    <mx:HBox>
      <mx:Text width="100" height="100" text="{data.name}"/>
      <mx:Image width="100" height="100" source="{data.imgURL}"/>
    </mx:HBox>
  </mx:Component>
</mx:itemRenderer> 

In this way you can customize your list items as you wish.