Below is a discussion of inter-component communication. I never
polished it up, but it will be some value anyway.
Tracy
Communicating between Components:
Note: for "loose coupling" use events. But that is another topic.
A non-trivial flex application is "component" based. While all of the
built-in controls are components, the question of communicating
between components most often arises when you are using a custom
component. A custom component, whether implemented in mxml or
ActionScript, has its own "scope". Within that component (Application
is a component too!), all sibling child controls share the same
scope, so you can refer to controls by their id. If the controls
(components) have public properties or methods, you can reference
those members directly through the id:
<mx:TextInput id="textinput1" text="test value" .../>
<mx:Text id="text1" ... text="{textinput1.text}" .../>
Ok, so far, its a "duh" right?
When you use custom components in a Flex app, at run time they make a
document object model hierarchy (DOM). Each subcomponent has its own
scope and code within that component can't *directly* reference the
member properties or methods of its sibling subcomponents.
So again, within a component, code can reference children directly,
as in the example above. But there are two other cases inherent in a
hierarchy. You might want to reference "up", to get to public
members of the parent, grandparent, etc, or 'down", to get to
a "grandchild".
Accessing members in the parent:
On an ordinary component DOM, you can reference the parent component
using the .parent property. Say that a control with id="textinput1"
exists in the parent of the current component. then you could do:
<mx:Text id="text1" ... text="{parent.textinput1.text}" .../>
Accessing members in the main application:
Components can be nested, sometimes very deeply. If the reference
you want is all the way at the top-level, main application (the one
with the <mx:Application> tag), you could do
{parent.parent.parent.textinput1.text}, but you would have to count
the component levels just right. Instead, you can use
Application.application to get to that scope:
<mx:Text id="text1" ...
text="{Application.application.textinput1.text}" .../>
You can shoretn this style of reference by importing
mx.core.Application, and assigning Application.application to a
variable, like _app, the doing (_app.textinput1.text)
Accessing components of a child component ("grandchildren"):
Say that in this case, a child component has the TextInput control
you want to reference. First, make sure the child component has an
id:
<myComp:MyCustomComp id="mycc1" .../>
Then, in the same scope (the same component/file that
contains "mycc1" above) you can say:
<mx:Text id="text1" ... text="{mycc1.textinput1.text}" .../>
Accessing a nested component:
As mentioned above you can go "up" the hierarchy
using "parent.parent...". You can also go "down" the hirearchy using
id references:
<mx:Text id="text1" ...
text="{mycc1.mycc11.mycc.12.textinput1.text}" .../>
Additional notes:
If you are using SWFLoader to load an entire Application, you can
reference the immediate parent application using "parentDocument".
You can also use Application.application to reach the main app, as
shown above.
Accessing members of an application loaded by SWFLoader is a bit more
complicated. See the example here:
http://www.cflex.net/showFileDetails.cfm?ObjectID=690
