nothing displays when i add a UIcomponent to canvas?

Question

i am trying to add a uicomponent which contains an object of a custom class the extends UIcomponents and i want to display this uicomponent to canvas i have done no error compile or run time but it does not display the Uicomponent.

here is code;

var item:RecordRanderer = new RecordRanderer();

        item.randerItem(child);
        item.x=20;
        item.y = 20+ycomponent;
        item.width = 90;
        item.height = 200;
        item.setStyle("backgroundColor","Red");

        this.addChild(item);

the record randerer is a cutom class that is also extension of UIcomponent which contains some textinputs etc.

now i add this to canvas but nothing displays

here is the custom class

internal class RecordRanderer extends UIComponent
{
    //----------------------------------------------------
    //Class varibles
    private var namelabel:Text = new Text();
    private var employname:TextInput = new TextInput();

    //----------------------------------------------------

    //RecordRanderer class constructor function
    public function RecordRanderer()
    {
        //--------------------------------
        this.height = 200;
        this.width = 200;

        //--------------------------------
        //name text box and label
        namelabel.text = "Name: ";
        namelabel.setStyle("fontSize",12);
        namelabel.x = 5;
        namelabel.y = 20;
        employname.setStyle("borderColor",0xA9C0E7);
        employname.setStyle("cornerRadius", 15);
        employname.setStyle("borderStyle", "Solid");
        employname.x = 100;
        employname.y = 20;

}

            public function set namevalue(val:String)
    {
        if(val.length > 0)
        {       
            namelabel.x = 5;
            namelabel.y = 10 + Height;

            employname.text = val;
            employname.x = 100;
            employname.y = 10 + Height;

            Height += 25;

        //  contain.addChild(namelabel);
        //  contain.addChild(employname);

            this.addChild(namelabel);
            this.addChild(employname);

        }//end if

    }//end function

what i have to do with to get any thing displayed

ask for more details

thanx

Answer 1

Check your canvas size. Also, attributes like "red" and "solid" are usually written in lowercase (not sure if it is required).

Answer 2

Read up on the component lifecycle in Flex (There are multiple questions on SO with the links).

You aren't following the correct practices when making a display component.