Flex: image switching place in tilelist

Answer 1

Maybe try to invalidate on creationComplete?

From what I recall with DataGrids (which work somewhat similarly to a tilelist), when an item comes into focus its recreated.

<mx:itemRenderer>
  <mx:Image id="myImage" creationComplete="myImage.invalidate()" />
</mx:itemRenderer>

Haven't tried this code but I think this is where you want to start looking. I took a look at your itemRenderer component. Try creationComplete instead of initialize to call your function

Answer 2

I don't have your app handy, so I can't test end-to-end, but I've looked at your source. You probably need to override the data setter in your itemRenderer:

<?xml version="1.0" encoding="utf-8"?>
<mx:Image xmlns:mx="http://www.adobe.com/2006/mxml" initialize="init()">

 <mx:Script>
  <![CDATA[

   override public function set data(value:Object):void
   {
    super.data = value;
    this.source = data;
    this.name = data.toString().split("/").pop().split(".").shift();
   }

   private function init() : void {
    // Removed from your source and transplanted above
   }

  ]]>
 </mx:Script>

</mx:Image>

Flex will attempt to re-use item renderers in lists (which means the lifecycle events you might be expecting -- initialize, creationComplete, etc. -- won't always fire), so if you want to be sure your renderer gets updated when the data item changes (as it will when scroll events happen), the best practice is to override the renderer's data property. That'll most likely fix the problem.