Question

I have a simple Itemrenderer with the following code:

<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:mx="library://ns.adobe.com/flex/mx" 
autoDrawBackground="true" width="90" height="90">
<s:VGroup horizontalAlign="center">
 <mx:Image source="{data.photo}" toolTip="{data.name}" />
</s:VGroup>
</s:ItemRenderer>

I would like to manipulate the data object before that it’s binded to the image attributes (source and tooltip). To do this, I modified the code in this way:

<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:mx="library://ns.adobe.com/flex/mx" 
autoDrawBackground="true" width="90" height="90"
initialize="itemrenderer1_initializeHandler(event)">
 <fx:Script>
 <![CDATA[
 import mx.events.FlexEvent;


 protected function itemrenderer1_initializeHandler(event:FlexEvent):void
  {
    var obj:Object = this.data;
    //here the manipulation
  }

 ]]>
 </fx:Script>
 <s:VGroup horizontalAlign="center">
 <mx:Image source="{data.photo}" toolTip="{data.name}" />
 </s:VGroup>
</s:ItemRenderer>

When I try to access to the this.data object, it’s always empty! Is there a way to manipulate the data object before binding? Probably i don’t have to use this.data, but i cannot find any other object to edit

Answer 1

I found it! I can access to the this.data object only when the creation of the ItemRenderer is completed! to this I have to manipulate the object after the creationComplete event!
Here the code:

<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark" 
                xmlns:mx="library://ns.adobe.com/flex/mx" 
                autoDrawBackground="true" width="90" height="90"
               creationComplete="itemrenderer1_creationCompleteHandler(event)"
                >
    <fx:Script>
        <![CDATA[
            import mx.events.FlexEvent;
            import valueObjects.Product;
            [Bindable]
            private var prd:Product;

protected function itemrenderer1_creationCompleteHandler(event:FlexEvent):void
            {
                            //here i can access to the this.data object!
                            this.prd = this.data as Product;
            }

        ]]>
    </fx:Script>
    <s:VGroup horizontalAlign="center">
        <mx:Image source="{prd.photo}" toolTip="{prd.name}" width="70" />
        <mx:Label text="{prd.name}"/>
    </s:VGroup>
</s:ItemRenderer>