Flash / TileList component

Hmmm, complicated.

I tried to solve it in a clean way, but Flash didn't let me go that easily. The basic idea is to set the upSkin style or whatever skin is needed for each itemRenderer (ImageCell) instead of all (like tileList.setRendererStyle ());

I thought it was easy to access the ImageCell class (default Cell Renderer for TileList), but it is not. The only way to access the cellRenderer method is itemToCellRenderer , but the item passed as an argument is from the ListEvent

I modified the example provided in the documentation to illustrate the idea. This code assumes you have a TileList component, plus three MovieClips with the following library links: Star, BlueBg, RedBg imports fl.controls .; import fl.controls.listClasses .; import fl.data .; import fl.events .;

var totalEntries:uint = 20;
var myTileList:TileList = new TileList();
myTileList.columnWidth = 125;
myTileList.rowHeight = 150;
myTileList.columnCount = 3;
myTileList.rowCount = 1;
myTileList.move(10,10);
addChild(myTileList);

for(var i:int=0; i<totalEntries; i++) {
    myTileList.addItem( { label:"star"+i, source:Star, scaleContent:false, index:i} ); 
}

myTileList.addEventListener(ListEvent.ITEM_ROLL_OVER, listItemOver);
function listItemOver(e:ListEvent):void {
    var imageCell:ImageCell = myTileList.itemToCellRenderer(e.item) as ImageCell;
    //e.index % 2 == 0 ? imageCell.setStyle('upSkin',BlueBg): imageCell.setStyle('upSkin',RedBg);
}

      

        
        
        
      

    

It will be messy even if it works. I'm having trouble sending ITEM_ROLL_OVER events, plus I don't think dispatching a ton of events when the component fills up, just for some colors, is such a good idea.

Sooo ... there are 2 things that stay true in Flash

• Almost no one wants the default behavior in Flash components. Everyone wants something a little different.
• The "magic" in Flash is finding the "brave" solutions, which I believe.

here is what worked for me: Note that when I add an element, I also add and index a property, so each element will know what it is indexing. Then I allow the content of each cell to choose what the correct skin should display (which creates dependencies, so there must be a clenear way to do this), so I added the following code to the Star MovieClip

import fl.controls.listClasses.ImageCell;

var cell:ImageCell = this.parent.parent.parent as ImageCell;
trace(cell.data.index);
if(cell.data.index %2 == 0) cell.setStyle('upSkin',BlueBg);
else cell.setStyle('upSkin',RedBg);

      

        
        
        
      

    

Hope it helps.