Flex: non-UIComponents in the Display List

July 17th, 2009

There are 2 main ways to add non-UIComponents to a Flex Container.

1. You may add the object to a SWFLoader, which does not require its children to extend UIComponent.

2. You may add the object to Container.rawChildren.

You have to be careful with the 2nd one. First of all, know that whatever is contained in Container.rawChildren is not sized, positioned or rendered automatically. You cannot, for example, put a button in there. Another thing is that anything added to Container.rawChildren is NOT contained in the Container.children, but the contrary is true. Relying on indices to remove from the display list might be tricky.Here's what I mean:

• You add 5 objects using Container.addChild()
• You add 5 objects using Container.rawChildren.addChild()
• You want to remove the last child of Container.rawChildren, and will use index 9 instead of 4, because rawChildren returns all 10 children.

The reason for Container.rawChildren is to add skins, not actual content. Container.getChildren() returns only elements that were added using Container.addChild(), not elements that were added using Container.rawChildren.addChild().

So my suggestion to you would be to use rawChildren only if you do not intend to remove these children later, like skins. If you wish to add interactive elements and other content, create a SWFLoader and add them to it. And if you have a UIComponent, always add it to the Container using Container.addChild().

Previous: What to expect from a dev team? Next: LinkBar was meant to be used with a ViewStack