Detecting when a mouse leaves a Flex application

The following example shows how you can detect when the mouse leaves the bounds of a Flex application by listening for the stage object’s mouseLeave event.

Full code after the jump.

View MXML

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/02/22/detecting-when-a-mouse-leaves-a-flex-application/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="top"
        backgroundColor="white"
        applicationComplete="init();">

    <mx:Style>
        Alert {
            modalTransparencyColor: black;
            modalTransparency: 0.6;
        }
    </mx:Style>

    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;
            import mx.managers.PopUpManager;

            private var _isMouseInSWF:Boolean = false;
            private var alert:Alert;

            [Bindable]
            private function get isMouseInSWF():Boolean {
                return _isMouseInSWF;
            }

            private function set isMouseInSWF(value:Boolean):void {
                _isMouseInSWF = value;
            }

            private function init():void {
                stage.addEventListener(MouseEvent.MOUSE_MOVE, stage_mouseMove);
                stage.addEventListener(Event.MOUSE_LEAVE, stage_mouseLeave);
            }

            private function stage_mouseLeave(evt:Event):void {
                isMouseInSWF = false;
                if (alert) {
                    PopUpManager.removePopUp(alert);
                }
                alert = Alert.show("GONE");
            }

            private function stage_mouseMove(evt:MouseEvent):void {
                if (!isMouseInSWF) {
                    if (alert) {
                        PopUpManager.removePopUp(alert);
                    }
                    // alert = Alert.show("BACK");
                    isMouseInSWF = true;
                }
            }
        ]]>
    </mx:Script>

    <mx:Label text="isMouseInSWF: {isMouseInSWF}" />

</mx:Application>

View source is enabled in the following example.

Tagged as: mouseLeave, mouseMove, removePopUp(), stage