CODEWITHSUNDEEP
actionscript-3flex4adobe
salgua
salgua

Reputation: 698

Manipulate data object in a itemrenderer - Adobe Flex 4

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

Upvotes: 2

Views: 4025

Answers (3)

Morten Gorm Madsen
Morten Gorm Madsen

Reputation: 81

Although not a new thread, do NOT go with CreationComplete. The event is invoked only once. The data will be set whenever the hosting component decides that the itemRenderer should be re-used. E.g. useVirtualLayout=true for a list.

Upvotes: 1

slim.tim
slim.tim

Reputation: 21

Another solution would be to override the set data function, like this:

<?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;

        override public function set data(value:Object):void
        {
           super.data = value;
           //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>

Upvotes: 2

salgua
salgua

Reputation: 698

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>

Upvotes: 1

Related Questions