Flash / TileList component

Question

Hi!
I have a problem and I hope that someone can help me
I hava Flash project with TileList in it
I need to change background of some items (not all) in this TileList to red and some to blue
Do you know how to do this?
Thanks

Answer 1

Hmmm, tricky one.

I tried to solve this in a clean way, but Flash wouldn't allow me to so easily. The basic idea is to set a upSkin style, or any other necesary skin for each itemRenderer(ImageCell) instead of all of them (as would tileList.setRendererStyle());

I thought that I could access the ImageCell class ( the default Cell Renderer for TileList) easily, but it's not the case. The only way I gained access to the cellRenderer itemToCellRenderer method, but the item passed as an argument comes from a ListEvent

I've modified the Example that comes in the documentation to illustrate the idea. This code assumes you have the TileList Component, plus three MovieClips symbols with the following linkages in the Library: Star, BlueBg, RedBg import 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);
}

This would get messy even if it would work. I has issues when dispatching ITEM_ROLL_OVER events, plus I don't think dispatching a ton of events when the component get populated, just for some colors is such a good idea.

Sooo...there 2 things that remain true in Flash

1. Almost no one wants the default behavior in Flash components. Everyone wants a little custom something.
2. The 'magic' in Flash stands in finding 'hacky' solutions I guess.

here's what worked for me: Notice that when I add an item, I also add and index property, so each item would know what's it's index. Next, I'm letting the content for each cell decide what's the right skin to display( which creates dependencies, so there should be a clenear way for this one) so I've added the following code in 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 this helps.