How to load a customise component?

Question

I have created a customised component that i want to load
dynamic.
In the end i want to send a instance of the component i want
to load to the user.mxml file.
So i dont need to create a new (user) file when i create a
new component.
I want to use the same user file but with some different
components.
My code looks like this.
------UserForm.mxml ----------------
<mx:VBox xmlns:mx="
http://www.adobe.com/2006/mxml"
width="350" height="100%" >
<mx:Label width="100%" id="headlabel" fontSize="20"
textAlign="left" />
<mx:Accordion width="100%" height="100%">
<mx:Canvas label="Användare" width="100%"
height="100%">
<mx:Form id="userForm"></mx:Form>
</mx:Canvas>
<mx:Canvas label="Företag" width="100%"
height="100%"> </mx:Canvas>
</mx:Accordion>
</mx:VBox>
------ User.mxml -----------------
<mx:Script><![CDATA[
public function init(url:String):void {
getURL += url;
var tmp:UserForm = new UserForm();
edit.addChild(tmp);
]]></mx:Script>
<mx:VBox id="edit" width="100%" height="100%">
<mx:HBox>
<mx:Button id="save" label="Save" bottom="10" right="10"
click="saveRow()"/>
</mx:HBox>
</mx:VBox>
The problem is that i can't se the UserForm.
How can i do?

Answer 1

The problem is the height="100%" in the UserForm.mxml. That
value is not going to be honored when you create the component
dynamically. You could try this:
var tmp:UserForm = new UserForm();
tmp.percentHeight = 100;
edit.addChild(tmp);
The other option is to explicity set the component's height:
tmp.height = edit.height; // since you want 100%
edit.addChild(tmp);
It's a little quirk of the Flex Framework.