Flex 4 ItemRenderer in Spark List Ghosting Issue when scrolling

I have an item renderer in a list, when I try to use the override method to setup the list items how I want them they are invisible.

When I try to use the function to set them up, every time I scroll the list consuming the renderer, it starts giving serious redraw problems.

When I combine both methods the Labels redraw correctly but the images ghost them selves up and down as I scroll.

Here is the code:

http://pastebin.com/FkjRBT3G

Please and thank you to any help you can give.

Edit most recent code

    <?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark" 
                xmlns:mx="library://ns.adobe.com/flex/mx" creationComplete="setupControls();"  autoDrawBackground="true" contentBackgroundAlpha="1.0" contentBackgroundColor="#000000">

    <fx:Script>
        <![CDATA[
            import flash.display.*;
            import flash.ui.ContextMenu;
            import flash.ui.ContextMenuBuiltInItems;
            import flash.ui.ContextMenuItem;

            import mx.controls.Alert;
            import mx.core.FlexGlobals;

        /*  override public function set data(value:Object):void{
                if(value != null)  {
                    super.data = value;
                    theLabel.text = value.UserName;
                    if (value.IsGroup == true){
                        imgGroup.visible=true;
                        theLabel.x = 24;
                        theLabel.setStyle("fontWeight", "bold")
                    }

                    if (value.IsGroup  == false){
                        imgUser.visible=true;
                        theLabel.x = 34;
                    }
                }
            }  */

        private function setupControls():void{
                    theLabel.text = data.UserName;
                    theLabel.y = 4;
                    if (data.IsGroup == 'true'){
                        imgGroup.visible=true;
                        theLabel.x = 24;
                        theLabel.setStyle("fontWeight", "bold")
                    }

                    if (data.IsGroup  == 'false'){
                        imgUser.visible=true;
                        theLabel.x = 34;
                    }

                    var availableFieldMenu:ContextMenu = new ContextMenu();
                    var chartSubTypeFieldMenu:ContextMenuItem = new ContextMenuItem("Add, Edit, Delete",false,true,true);
                    availableFieldMenu.customItems.push(chartSubTypeFieldMenu);
                    chartSubTypeFieldMenu.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, menuItemHandler);
                    availableFieldMenu.hideBuiltInItems();
                    this.contextMenu = availableFieldMenu;
                }   


        public function menuItemHandler(event:ContextMenuEvent) : void{
            if (event.currentTarget.caption=="Add, Edit, Delete"){
                Alert.show('Right Click Just Happened!');
            }
        }




        ]]>
    </fx:Script>


    <s:Label y="4" id="theLabel" color="#000000"/><mx:Image id="imgGroup" source="@Embed(source='file:/D:/Work/RapidReport/Images/nd0071-16.png')"  width="16" height="16" x="3" visible="false" buttonMode="true"/><mx:Image id="imgUser" source="@Embed(source='file:/D:/Work/RapidReport/Images/nd0032-48.png')" width="16" height="16" x="13" visible="false"/>

</s:ItemRenderer>

Regards Craig

I fixed it by turning off use virtual layout, the context menus work well actually ;)

The list it self is bound to an xml list using a {}