Custom Event from Item Renderer not detected by a class

Question

I am trying to dispatch a custom event from an item renderer(which is a child of the Main application file / root).

Code in Main.mxml:

<s:List id="movieGrid"itemRenderer="views.MovieRenderer" dataProvider="{new ArrayCollection()}">
    </s:List>

<s:Group width="100%" height="100%" bottom="60">
            <views:DetailedViewInfo id="detailed" includeIn="MoviePage" />
    </s:Group>

Renderer (something clicked):

MyEventDispatcher.Dispatcher.dispatchEvent(new MovieClickEvent(MovieClickEvent.CLICKED, data));

DetailedViewInfo (creation complete):

MyEventDispatcher.Dispatcher.addEventListener(MovieClickEvent.CLICKED, clickHandler);

MyEventDispatcher:

package events
{
    import flash.events.EventDispatcher;

    public class MyEventDispatcher
    {   
        public static var Dispatcher:EventDispatcher = new EventDispatcher();
    }
}

Event:

package events
{
    import flash.events.Event;

    public class MovieClickEvent extends Event
    {
        public function MovieClickEvent(type:String, theMovieData:Object, bubbles:Boolean=true, cancelable:Boolean=false)
        {
            super(type, bubbles, cancelable);
            this._result = theMovieData;
        }

        public function get result():Object
        {
            return this._result;
        }

        override public function clone():Event
        {
            return new MovieClickEvent(type, result, bubbles, cancelable)
        }

        public static const CLICKED:String = "MovieClickEvent.CLICKED";

        private var _result:Object;

    }
}

I am able to listen for the event successfully in the Main.mxml but I also need to detect it in a SkinnableContainer - "DetailedViewInfo" that is also a child of Main.mxml:

It his possible at all? I tried importing all related events / classes and same for declarations. It does not work even if I comment out the event listener in Main.mxml. I tried adding a declaration to the item renderer in DetailedViewInfo but that crashes the application with no understandable error.

Could someone explain to me how this should be done? I am using custom events all over the place in my application and hadn't had this happen before. Any help highly appreciated!

Answer 1

It would seem you're adding the event listener after the event was dispatched. I see you have an includeIn statement there: this means the DetailedViewInfo component will not be immediately created, but only when the MoviePage state is entered. The event may be dispatched before the component is created and the event listener attached.

The quick fix for this issue, is to not use includeIn, but set the component's visibility according to the current state:

<views:DetailedViewInfo id="detailed" visible="false" includeInLayout="false"
    visible.MoviePage="true" includeInLayout.MoviePage="true" />

However, you may want to review your architecture if you need to resort to this. Unfortunately I can't tell you much more than that, since I don't know your current architecture.