3 Replies Latest reply on May 16, 2007 9:10 AM by peterent

    Redraw/refresh tilelist?

      I have an application that a user will drag an entry in a datagrid to a tilelist, and dropping the item updates an array with the data from the grid. This part works just fine, but what I want to do is to change the style of the itemrenderer in the tileslist so that the square the item was dropped on to changes color.

      If the array already has an entry for that day, I can set the style when each item in the tilelist is created, but I don't want the user to need to refresh the browser for the new days to show up.

      I've tried using tileList.updateList(), but it doesn't seem to work. Is there a way to programmatically redraw the tilelist so the creationComplete method of the item renderer will fire again?
        • 1. Re: Redraw/refresh tilelist?
          peterent Level 2
          You need to change your philosophy a bit. The itemRenderer should make this color change in its updateDisplayList function. That function should look at some data in the itemRenderer to tell it what to do. Let's say you have a set property function which sets a flag, that function should also call invalidateDisplayList() - this is all in the itemRenderer. When the drop completes, if you have the itemRenderer instance, you can set the flag and the setter function will do the rest.

          If you don't have the itemRenderer instance, you'll have to modify the data for the tile list and call the data's itemUpdated function. That will trigger the tile list to repaint the itemRenderers which can determine what they should draw.

          It isn't really that complex, especially if the itemRenderer implements the dragDrop event so you can do everything from within the itemRenderer.

          For example: let's the following code is in your itemRenderer class:

          private var _dropColor:Number = 0; // 0 means no color
          public function set dropColor( value:Number ) : void
          _dropColor = value;
          public function get dropColor() : Number { return _dropColor; }
          override protected function updateDisplayList( unscaledWidth:Number, unscaledHeight:Number ) : void
          super.updateDisplayList( unscaledWidth, unscaledHeight );
          setStyle( "backgroundColor", dropColor );

          Now the dragDrop event handler should call the itemRenderer's dropColor property set function. Assuming the variable IR contains an itemRenderer instance, you could do: IR.dropColor = 0xff0000;
          • 2. Re: Redraw/refresh tilelist?
            ekokurtz Level 1
            Thanks for the reply Peter, but it ended up I was making it much more difficult than I needed to. I added a styleName attribute to the array collection that is feeding the tileList component, initially set to nothing. When I drop an entry onto the tileList, I just updated the corresponding styleName value to reflect an entry from my stylesheet, and the color changed that way. Now, I don't need to call a function at any point in the process for this to work correctly.

            Thanks again

            • 3. Re: Redraw/refresh tilelist?
              peterent Level 2
              There are many ways to do these things in Flex; you found a way that works for you and was easier. Good job!