Flex mobile prevent item renderer state from recycled

Question

I have this custom list item renderer where I have defined 2 custom states:

<s:states>
    <s:State name="expand"/>
    <s:State name="collapse"/>
</s:states>

When I select one of the list item, it will change to state collapse. Now whenever I select the first or the last item in the list and I refresh the data provider, the current state of both the items will swap places.

Please guide me on how to retain the state of the itemrenderer. Thank you.

Note: It all works well when I change the usevirtuallayout to false. But, it is not what I intended to change.

[Edit] The following is my code for the item renderer:

<fx:Script>
    <![CDATA[

protected function init(event):void
{
    currentState = "collapse";
}

override public function set data(value:Object):void 
{
    trace(currentState.toString());
}

protected function btn_clickHandler(event:MouseEvent):void
{
    currentState = "expand";
}

]]>
</fx:Script>

<s:states>
    <s:State name="expand"/>
    <s:State name="collapse"/>
</s:states>

<s:Button id="changeStateButton" click="btn_clickHandler(event)"/>

The example above is a simple item renderer where a single button will change the currentState of the itemrenderer. I have 3 items in the data provider and each one of them is in the "collapse" state by default. This is the trace result from the set data function:

collapse
collapse
collapse

When I click the button at the last item... this will be the trace result:

collapse
collapse
expand

Now, when I refresh the data provider by calling this function "arraycollection.refresh()"...this is the result:

expand
collapse
collapse

Can somebody explain this scenario? Notice that this only happens when the useVirtualLayout is set to true...

Please give more context. The code used to display the list by example. — Pascal Le Merrer
hi @PascalLeMerrer please refer to the new edit I added above — Victor Yew

user3277549 user3277549 · Accepted Answer · 2014-03-14T01:31:12

Try reassigning the item renderer after updating the data provider.

//update data provider
itemList.dataProvider = myCollection;
//update the item renderer
itemList.itemRenderer = new ClassFactory(cutomItemRenderer);

This solution of course will be more resource intensive.

Flex mobile prevent item renderer state from recycled

1 Answers