This example shows you how to customize selection boxes in a Flex TileList. Marc’s original post Customizing TileList selection explains which methods you need to override, Thanks Marc.

main.mxml

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

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
    xmlns:comps="comps.*" viewSourceURL="srcview/index.html">
    <comps:CardTileList itemRenderer="ir.Card" width="479" height="371">
        <comps:dataProvider>
            <mx:ArrayCollection>
                <mx:source>
                        <mx:Object label="2A" data="2a"/>
                        <mx:Object label="2B" data="2b"/>
                        <mx:Object label="2C" data="2c"/>
                    </mx:source>
            </mx:ArrayCollection>
        </comps:dataProvider>
    </comps:CardTileList>
</mx:Application>

comps/CardTileList.as

package comps
{
    import flash.display.Graphics;
    import flash.display.Sprite;
    import mx.controls.TileList;
    import mx.controls.listClasses.IListItemRenderer;

    public class CardTileList extends TileList
    {
        public function CardTileList()
        {
            super();
        }

        override protected function drawSelectionIndicator(indicator:Sprite,
                                                        x:Number,
                                                        y:Number,
                                                        width:Number,
                                                        height:Number,
                                                        color:uint,
                                                        itemRenderer:IListItemRenderer):void

        {
            var g:Graphics = indicator.graphics;
            g.clear();
            g.beginFill(0x009dff);
            g.lineStyle(2, 0x6e7c9d);
            //g.drawRoundRect(x,y,itemRenderer.width,height,15,15);
            g.drawRoundRect(x+(itemRenderer.width-150)/2, y, 150, height, 34, 34);
            g.endFill();
        }

        override protected function drawHighlightIndicator(indicator:Sprite,
                                                           x:Number,
                                                           y:Number,
                                                           width:Number,
                                                           height:Number,
                                                           color:uint,
                                                           itemRenderer:IListItemRenderer):void

        {
            var g:Graphics = indicator.graphics;
            g.clear();
            g.beginFill(0x009dff);
            g.lineStyle(2, 0x6e7c9d);
            //g.drawRoundRect(x,y,itemRenderer.width,height,15,15);
            g.drawRoundRect(x+(itemRenderer.width-150)/2, y, 150, height, 34, 34);
            g.endFill();
        }
    }
}