Question

I am working on a small photo Gallery. I create a xml file and try to link it to my List control with itemrenderer. However, when I tried to save the file, I got access of undefined property “data” error. I thought we are suppose to use “data” to refer the current row of the data object. Here is my code…and thanks a lot!

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
      xmlns:s="library://ns.adobe.com/flex/spark" 
      xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
 <fx:Declarations>
  <fx:Model id="pictureXML" source="data/pictures.xml"/>
  <s:ArrayList id="pictureArray" source="{pictureXML.picture}"/>
 </fx:Declarations>



 <s:List id="pictureGrid" dataProvider="{pictureArray}" 
   horizontalCenter="0" top="20">
  <s:itemRenderer>
   <fx:Component>
    <s:HGroup>
     <mx:Image source="images/big/{data.source}" /> // where the error happen
     <s:Label text="{data.caption}"/> // where the error happen
    </s:HGroup>   

   </fx:Component>
  </s:itemRenderer>
 </s:List>


</s:Application>

My xml

<?xml version="1.0"?>
<album>
   <picture>
   <source>city1.jpg </source>
   <caption>City View 1</caption>
   </picture>
    <picture>
   <source>city2.jpg </source>
   <caption>City View 2</caption>
   </picture>
     <picture>
   <source>city3.jpg </source>
   <caption>City View 3</caption>
   </picture>
    <picture>
   <source>city4.jpg </source>
   <caption>City View 4</caption>
   </picture>
    <picture>
   <source>city5.jpg </source>
   <caption>City View 5</caption>
   </picture>
    <picture>
   <source>city6.jpg </source>
   <caption>City View 6</caption>
   </picture>
    <picture>
   <source>city7.jpg </source>
   <caption>City View 7</caption>
   </picture>
    <picture>
   <source>city8.jpg </source>
   <caption>City View 8</caption>
   </picture>
    <picture>
   <source>city9.jpg </source>
   <caption>City View 9</caption>
   </picture>
    <picture>
   <source>city10.jpg </source>
   <caption>City View 10</caption>
   </picture>
</album>

I appreciate any helps!!!

Answer 1

<s:List id="pictureGrid" dataProvider="{pictureArray}" 
   horizontalCenter="0" top="20">
  <s:itemRenderer>
   <fx:Component>
      <s:ItemRenderer>
    <s:HGroup>
     <mx:Image source="images/big/{data.source}" /> // where the error happen
     <s:Label text="{data.caption}"/> // where the error happen
    </s:HGroup>   
    </s:ItemRenderer>
   </fx:Component>
  </s:itemRenderer>
 </s:List>

Try This! It would work