How can I define custom 'contentGroups' in a custom Flex 4 component?

Question

The spark panel component for example can be written like this

And its skin file will handle layout of the contentGroup, controlBarGroup, and titleDisplay. Notice, however that the contentGroup is doesn't appear in the code above and that the controlBarGroup accepts child mxml components.

Now say I want to create a custom component that defines various required and non-required skinparts, such as 'headerGroup', 'navigationGroup', and 'accountPreferencesGroup'. I'd like to write this custom component like this

The motivation here is that I can now create a couple different skin files to change the look and layout of those subgroups. Reading source of the spark panel, there are some calls within the mx_internal namespace such as getMXMLContent() which is a method of the spark group component, but which I have no access to.

Does the description above make sense? How can I create custom 'contentGroups' in my custom Flex4 component that can use nested mxml child components? Should I approach this a different way?

Answer 1

So... after working things through a bit more... I found that it its possible to use mx_internal namespace by adding the following

import mx.core.mx_internal; use namespace mx_internal;

Adobe uses this namespace to mark methods and properties that may change in the future so they use this namespace to hide things.

If you follow the code in Panel.as you can get this work and define your own custom content areas.

Answer 2

I ran across this blog post recently. It gives a pretty good explanation of what you speak of, I believe.

http://saturnboy.com/2010/07/multiple-content-area-containers/