1 Reply Latest reply on Jun 4, 2010 2:47 AM by Moustik1664

    ItemRenderers bug while scrolling a DataGrid

    Moustik1664

      I know this is not a new problem for Flex users, but i can't solve it.

       

      I'm trying to build a DataGrid with Panels as ItemRenderers. This ItemRenderer is the same for all columns, so that i can get a grid. In order to do that, my ItemRenderer implements the IDropInListItemRenderer. Each cell is a Panel, which include a label, and a List, with a color depending of the data.

      Everything work fine, and it's pretty fast.

       

      My problem is, when i scroll the DataGrid, all my cells are mixed up, and don't display the right data. However, with some traces, i'm sure that the datas displayed in the itemRenderer are good.

       

      After some search, i know that the ItemRenderers are reused by Flex, and there are some similar problems along the web. But i don't know what to do... :/

       

      Here is my code :

       

      <?xml version="1.0" encoding="utf-8"?>

      <mx:Panel

       

       

      xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="100%" height="100%" implements="mx.controls.listClasses.IDropInListItemRenderer"

      horizontalScrollPolicy="

      off" verticalScrollPolicy="off" styleName="{_style}">

       

      <mx:Script>

      <![CDATA[

       

       

      import com.tbsfrance.project.trafficgrille.data.Donnee;

       

      import com.tbsfrance.project.trafficgrille.data.Stock;

       

       

      import flash.utils.setTimeout;

       

       

      import mx.binding.utils.BindingUtils;

       

      import mx.collections.ArrayCollection;

       

      import mx.controls.dataGridClasses.DataGridListData;

       

      import mx.controls.listClasses.BaseListData;

       

      import mx.controls.listClasses.IDropInListItemRenderer;

       

      import mx.events.ScrollEvent;

       

       

      private var _listData:BaseListData;

       

      [

      Bindable]

       

      private var _libelle : String ;

      [

      Bindable]

       

      private var _style : String = "grillePanelVide" ;

       

       

      //Define getter for the listData property

       

       

      public function get listData() : BaseListData

      {

       

      return _listData ;

      }

       

       

      //Define setter for the listData property

       

       

      public function set listData( value:BaseListData ) : void

      {

      _listData = value;

      }

      override

       

       

       

       

       

      public function set data(value:Object):void

      {

       

      if(value != null) {

       

      super.data = value ;

      getLibelle() ;

      }

       

       

      else

      {

      vbox.visible =

       

      false ;

       

      this.styleName = "grillePanelVide" ;

      }

      }

      public

       

       

       

      //This is my function to analysing the data and setting the right text and style

      //This is my function to analysing the data and setting the right text and style

       

      function getLibelle () : String

      {

       

      var indice : int = int(DataGridListData(listData).dataField) ;

       

      if ( data is Donnee && indice >= 0)

      {

       

      var mesStocks : ArrayCollection = Donnee(data).parutions[indice] ;

       

      if ( mesStocks && mesStocks.length > 0 )

      {

       

      var stock : Stock = mesStocks.getItemAt(0) as Stock ;

       

      if ( stock )

      {

       

      trace ("Pour " + Donnee(data).libelle + " : " + stock.emplacementLibelle + " " + stock.libelleDateParution) ;

      _libelle = stock.libelleDateParution +

      " - " + Donnee(data).libelle ;

      _style = stock.style ;

      }

       

      else

      {

      _libelle =

      "" ;

      _style =

      "grillePanelVide" ;

      }

      }

      }

       

      return "" ;

      }

      ]]>

       

      </mx:Script>

       

       

      <mx:VBox id="vbox" width="100%" height="100%" horizontalScrollPolicy="off" verticalScrollPolicy="off">

       

      <mx:Label id="labelCellule" styleName="grilleLabel" text="{_libelle}"/>

       

      </mx:VBox>

       

      </mx:Panel>

       

       

       

      Thx for your help !