user1546927
user1546927

Reputation: 201

Display an alert which cannot be closed by user, closes automatically on event

I have a Flex application which sends a query to a database when an user clicks a button. Since the query might be heavy, and can take up to a minute, I want to display an alert, which will close only after an event comes back from the database (user won't be able to close it himself). Is it possible in Flex? How do I do that?

I have functions sendQuery() and dataEventHandler(). I think I need to put code in sendQuery() to display the alert and in dataEventHandler() to close it after data comes from the DB, but how do I make the alert "unclosable" by the user?

Upvotes: 0

Views: 529

Answers (5)

Stanislav Stankov
Stanislav Stankov

Reputation: 135

@Alex, I used your code but modify it a bit, because there was some errors:

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx"
         creationComplete="creationCompleteHandler()" width="100%" height="100%">
    <fx:Script>
        <![CDATA[

            import mx.core.FlexGlobals;
            import mx.core.UIComponent;
            import mx.managers.PopUpManager;

            ///////////////////////////////////////
            //// public functions - my group is ImageViewer.mxml component


            public static function show():ImageViewer {
                return PopUpManager.createPopUp(FlexGlobals.topLevelApplication as DisplayObject, ImageViewer) as ImageViewer;
            }

            public function hide():void {
                PopUpManager.removePopUp(this);
                FlexGlobals.topLevelApplication.enabled = true;
            }


            ////////////////////////////
            //// component events

            private function creationCompleteHandler():void {
                PopUpManager.centerPopUp(this);
                FlexGlobals.topLevelApplication.enabled = false;
            }
            ]]>
    </fx:Script>
</s:Group>

And call it like:

var imageviewer:ImageViewer = ImageViewer.show();
//imageviewer.imageURL = _value_dto.value;

Upvotes: 0

Alex
Alex

Reputation: 907

As an idea you can create a custom alert then:

  1. Show Alert
  2. Disable Application.
  3. Hide Alert.
  4. Enable Application.

An alert example:

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300"
         creationComplete="onCreationComplete(event)">

    <s:Rect>
        <s:fill>
            <s:SolidColor color="0xFFFFFF"/>
        </s:fill>
        <s:stroke>
            <s:SolidColorStroke />
        </s:stroke>
    </s:Rect>

    <s:Label text="Please Wait..."/>

    <fx:Script>
        <![CDATA[
            import mx.core.FlexGlobals;
            import mx.events.FlexEvent;
            import mx.managers.PopUpManager;
            public static function show():void
            {
                PopUpManager.createPopUp(FlexGlobals.topLevelApplication);      
            }

            public static function hide():void
            {
                PopUpManager.removePopUp(this);
                FlexGlobals.topLevelApplication.enabled = true;
            }

            protected function onCreationComplete(event:FlexEvent):void
            {
                PopUpManager.centerPopUp(this);
                FlexGlobals.topLevelApplication.enabled = false;
            }
        ]]>
    </fx:Script>
</s:Group>

Usage:

YourAlert.show();

YourAlert.hide();

Upvotes: 0

csomakk
csomakk

Reputation: 5497

make a 0-0.2 alpha shape what covers the whole application (probably you'll want to listen for resizeevents), and add a custom panel to the middle of it, with the message.

Upvotes: 0

Mahesh Parate
Mahesh Parate

Reputation: 786

Following code may help you… (One of the solution...) You can find I have made Solution 1 and Solution 2… You can use any one of it and third solution is to create your own Custom Component. Please find below code…. You can use below logic to solve your problem.. Use Timer to check if data received or you can dispatch custom event and call updateAlertPosition function.

Hope it may help: -

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
               >
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>

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

            private var minuteTimer:Timer;
            private var alert:Alert;

            private var displayInitialText:String = "Data Not Received, Please wait...."; 
            private var displayDataReveivedText:String = "Data Received...";

            private function timerInit():void
            {
                //Logic to check if data Received.
                minuteTimer = new Timer(3000);
                minuteTimer.addEventListener(TimerEvent.TIMER, updateAlertPosition);
                minuteTimer.start(); 
            }

            private function updateAlertPosition(event:Event = null):void {
                minuteTimer.stop();
                //Solution 1
                //add your flag here if y you want to check if data is received or not
                //if(Data Received)
                alert.mx_internal::alertForm.mx_internal::buttons[0].enabled = true;
                alert.mx_internal::alertForm.mx_internal::buttons[1].enabled = true;
                alert.mx_internal::alertForm.mx_internal::textField.text = displayDataReveivedText;
                //Solution 2
                //alert.enabled = true;
                //If you want to remove it automatically
                //closeAutomatically();
            }

            private function closeAutomatically():void
            {
                PopUpManager.removePopUp(alert);
            }

            private function clickHandler():void
            {
                //Start Timer
                timerInit();
                //Solution 1
                alert = Alert.show(displayInitialText, "Alert", Alert.OK|Alert.CANCEL,this,alertCloseHandler);
                alert.mx_internal::alertForm.mx_internal::buttons[0].enabled = false;
                alert.mx_internal::alertForm.mx_internal::buttons[1].enabled = false;
                //Solution 2
                //alert.enabled = false;
            }

            private function alertCloseHandler(event:CloseEvent):void
            {
                if(event.detail == Alert.CANCEL)
                {
                    //Some Code on close
                }
                else
                {
                    //Some Code on OK
                }

            }
        ]]>
    </fx:Script>

    <s:Button label="Show Alert" x="100" y="100" click="clickHandler()"/>
</s:Application>

Upvotes: 0

JeffryHouser
JeffryHouser

Reputation: 39408

The built in Flex Alert class will always have some type of close button.

However, there is no reason you can't create your own component; and then open and close it using the PopUpManager.

Upvotes: 1

Related Questions