Always Get Better

Accessing the stage in Flex

When creating components in Flex, designers sometimes need to attach events to the main stage. Unless the application has reached creationComplete, the stage property of custom components will be null.

If you need to, for example, attach a MOUSE_MOVE event to the application stage from a component that doesn’t include a creationComplete override, you have two options.

Wait for Event.ADDED_TO_STAGE

[source:jscript]
addEventListener( Event.ADDED_TO_STAGE, function(e:Event):void
{
stage.addEventListener( MouseEvent.MOUSE_MOVE, myMouseMoveEvent );
});
[/source]

Attach Through the System Manager Object

The system manager parents all displayable elements within the Flex application. It is an elegant way of accessing the stage through custom flex components which have not yet been added to it.

[source:jscript]
systemManager.stage.addEventListener( MouseEvent.MOUSE_MOVE, myMouseMoveEvent );
[/source]

Tags: ,

3 Responses to “Accessing the stage in Flex”

  1. Dean says:

    Thank you!!! Good grief! I’ve been trying to figure this out for days.

    “systemManager.stage” – that’s what I was looking for!

  2. Patrick says:

    I had to use the systemManager.stage as well. I put the event listener in my creation complete event:

    systemManager.stage.addEventListener(Event.RESIZE, onStageResize); // Listen for resizing

    And then my event listener looked like this:
    private function onStageResize(e:Event):void
    {
    var widthScale:Number = systemManager.stage.stageWidth / 240; // Determine scaling
    scaleX = scaleY = widthScale; // Resize both the x and y
    }

  3. greg says:

    Thanks!

    Saved many frustrations 😛

Leave a Reply