Event-based interaction between two custom classes

Question

Hello everybody. I have such problem: I have 2 custom components, which have their own nesting hierarchy ... One is container for another. I have to "familiarize them" with each other. The way I'm trying to achieve that is using global events (one side is firing and the other one is catching):

Application.application.addEventListener("Hello", function (data:Event):void{
        // .. some actions
    });

//and
Application.application.dispatchEvent(new Event(Hello));

Everything is pretty good, but there's one thingy .. when I'm trying to catch the event, I can't access the class, who is catching it. E.g.:

1. Container fires the event.
2. Child caughts it.
3. Then should be created the connection between container and it's child.

BUT, the only thing I could acheive is passing a reference to the Container in the DynamicEvent. Is there any chance that I could access the child at the event-handler function. Or maybe there's more elegant way to solve this problem ...

Any help would be greately appreciated :)

Answer 1

In most cases, either target or currentTarget will give you access to the component that is firing the event.

http://livedocs.adobe.com/flex/3/langref/flash/events/Event.html http://livedocs.adobe.com/flex/3/langref/flash/events/Event.html#currentTarget http://livedocs.adobe.com/flex/3/langref/flash/events/Event.html#target

However, with your approach, you are firing the event from the top level application; not from either of your nested components. This strikes me as unusual.

I envision you have a hierarchy like this:

Application

--- Container1

-------Container2

I would recommend firing the event from container2 and listening for it in container1.

Your dispatch code in Container2 will be something like this:

this.dispatchEvent(new Event('myCustomEvent'));

In container1 you can listen for the event something like this:

container2.addEventListener('myCustomEvent', onMyCustomEvent);

If you do need to add custom event data to your event; you can create your own custom event class and add data. Do you have a specific use case for firing the events off the Application container? I'd love to hear it.

Answer 2

We've done as Flextras says, create custom events, in our case Cairngorm events, and actually added data, a reference to the container you want the event responder to reply to. I didn't really like doing it that way though, as on very rare occasions the container might not be in a state where it can be interacted with. In our case we have a lot of dynamically loaded modules that can come and go, and then WHAM! Suddenly you get the flex equivalent of an null pointer exception. But that's the price you pay when you're highly asynchronous, a lot of null checking and exception catching.

Answer 3

The type of event management you're looking for is well solved with a dependency-injection framework like Mate or Swiz. Basically, you're needing to catch events on a global level, and then execute various actions throughout your application in various components on those events.

Mate has the concept of an EventMap that allows you to map certain events to interact with your views in various way. You can inject values into view properties or call methods within a view when certain events happen.

If you don't want to go with a framework, look at the bubbles property of the Event class. When you override the Event class to create a custom event, set the default value of bubbles to true. That way, your events will continue to bubble up to the main application, regardless of how deeply they are nested in your application.