public class PictureCellRenderer extends AlternatingCellRenderer {
 
    /**
     * Skin parts used to render the data
     */
    protected var img:Image;
    protected var lbl:Label;
    protected var bg:Sprite;
    protected var format:TextFormat;
 
    public function PictureCellRenderer() {
        super();
        // hide the built in label
        label.visible = false;
        createUI();
    }
    /**
     * setSize() is called everytime the tiles size are changed
     * this is where we add our method layout() to reposition/redraw
     * various parts of the cell renderer.
     */
    override public function setSize(w:Number, h:Number):void {
        super.setSize(w, h);
        //we want to draw the skin parts only when the
        //actual width/height are set
        //this method is called first for the default sizes and then for
        //for the user prefered sizes
        if (stage) {
            layout();
        }
    }
    /**
     * Updates the text and image everytime a new data is set
     * for this renderer instance.
     */
    override public function set data(value:Object):void {
        super.data = value;
        //Update the image source and text if there is valid data.
        if (value) {
            img.setImage(value.img);
            lbl.text = value.label;
        }
    }
    /**
     * Create all the cell renderer components just once
     */
    private function createUI():void {
        img = new Image();
        bg = new Sprite();
        lbl = new Label();
 
        //...
        //code to position the img, Sprite, and label
        //...
 
        addChild(img);
        addChild(bg);
        addChild(lbl);
    }
    /**
     *     Draws the rectangle used as background
     *  for the label
     */
    private function drawBg():void {
        //code to redraw the gray rounded rectangular
    }
    /**
     * Reposition/redraw the renderer parts
     * everytime the tile size is changed
     */
    private function layout():void {
        lbl.y = height - 20;
        lbl.width = width - 10;
        drawBg();
        onComplete(new Event(Event.COMPLETE));
    }
    /**
     * Resize the image once the bits were loaded
     */
    private function onComplete(e:Event):void {
        img.setSize(width - 20, height - 20);
    }
}