6 Replies Latest reply: Mar 2, 2010 3:05 PM by rfrishbe RSS

    Spark list itemrenderer issues. Scrolling cause rendering issues...

    flairjax Community Member

      I have a custom itemrender I am using for my spark list and in the list some items are blue and some are white. When I scroll the list white items all become blue.  Sometimes blue become white. Random color swapping.

       

      I think a read a post or article about this as Flash is trying to reuse itemRenderers, from an object pool of sorts, to conserve resources. How can I stop it from reusing itemrenders.

       

      TIA, J

        • 1. Re: Spark list itemrenderer issues. Scrolling cause rendering issues...
          Peter deHaan Community Member

          Try <s:List useVirtualLayout="false">

          • 2. Re: Spark list itemrenderer issues. Scrolling cause rendering issues...
            Jaylach Community Member

            Hi Dallas,

             

            I'm pretty sure that you cannot stop Flex from reusing the itemRenderers. I could be wrong, so maybe one of the many Flex Gurus here could speak to that.

             

            As for solving your issue, try overriding the "set data" method or listening for the "dataChanged" even on your itemRenderer. Do your color logic in there. The data for the itemRenderer will be set by Flex when it needs to render that renderer, so if you handle the logic in one of those methods you should be all set. Alternatievly, you could handle the color logic by overriding the updateDisplay() method, but if the only thing you need to do is change the items color then I would stay away from that approach and go with the "set data" or the "dataChanged" approach

            • 3. Re: Spark list itemrenderer issues. Scrolling cause rendering issues...
              Sunil Davé Community Member

              You don't necessarily want to stop it from reusing itemRenderers that's a good thing.  Rather, you need to implement your item render so that it sets it's values based on the data property that the list sets each time the renderer is re-used.

               

              If you really want to disable the object pooling/renderer recycling, set the "useVirtualLayout" property on your List or your layout class to false.  You can set this on either one.

               

              If you want to implement your itemRenderer properly, you do something like this in the itemRenderer:

               

              override public function set data(value:Object):void

              {

                  if (value != data)

                  {

                      super.data = value;

                      myItemRendererColor = data.color;

                  }

                  // you should also dispatch a Flex.DATA_CHANGE event here

              }

               

              This is just a simple example, you should google this topic (or check out Alex Harui's blog, or read the Flex docs) to make sure you do it right

               

              HTH,

              Sunil

              • 4. Re: Spark list itemrenderer issues. Scrolling cause rendering issues...
                flairjax Community Member

                ItemRendererFunction is the ticket.

                • 5. Re: Spark list itemrenderer issues. Scrolling cause rendering issues...
                  Sunil Davé Community Member

                  It sounds like you're planning on using the itemRendererFunction property and two separate itemRenderers, just to make the color be white or blue?

                   

                  If you follow any of the suggestions given here, you can solve your problem and only create one itemRenderer.

                   

                  Just my two cents, but the itemRendererFunction property is when your item renderers are truly different animals ... not for cases when one should be blue or white

                   

                  Message was edited by: Sunil Dave'

                  • 6. Re: Spark list itemrenderer issues. Scrolling cause rendering issues...
                    rfrishbe Community Member

                    As others have said, the issue is not that you want to turn off item renderer recycling (we do it for a reason), but you need to code your item renderer for re-use.  What that means is instead of something like:

                     

                    override public function set data(value:Object):void

                    {

                        super.data = value;

                     

                        if (data.income > 100000)

                            bgRectColor.color = 0x0000FF; // blue

                    }

                     

                    You need to do something like:

                     

                    override public function set data(value:Object):void

                    {

                        super.data = value;

                     

                        if (data.income > 100000)

                            bgRectColor.color = 0x0000FF; // blue

                        else

                            bgRectColor.color = 0xFFFFFF; // white

                    }

                     

                    In other words, don't just assume that the background rect starts out as white.  This item renderer could be re-used from before, so you need to explicitly set it back to white in that case.  I'd have to look at your item renderer to see exactly what the issue is, but I hope that helps.

                     

                    -Ryan