Question : Fading in/out a popup Window in Flex 4.0

Hi:

I'm relatively new to the world of Flex.

I have a popup window ( <s:Panel>) that displays a greeting.
The window is independent of my main application window/form.
The window only contains a couple of greeting messages with now buttons.
I'd like to fade the window in, and after a delay have the window automatically fade out.

I'm displaying the window via: PopUpManager.addPopup(welcomeForm, this, false);
I'll remove/hide the window via: PopupManager.removePopup(welcomeForm);

1) How do I enable the fadeIn/fadeOut functionality?
2) How do I automatically cause the window to hide/fadeOut .. some sort of timer?

Thanks,
JohnB

Answer : Fading in/out a popup Window in Flex 4.0

You can enable Fade In and Fade out using Flex effects and adding them to the popUp for right triggers.
Timer is the best choice.

Here is your complete code, I took some time out to solve your problem as I couldn't help much with your previous question.

Regards,

Siva

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:



Main.mxml
-------------------------------------------------------------------
<?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:Script>
		<![CDATA[
			import mx.managers.PopUpManager;
			private var test:Test;
			protected function button1_clickHandler(event:MouseEvent):void
			{
				test =  new Test();
				PopUpManager.addPopUp(test,this,false);
				startTimer();
			}
			
			public function startTimer():void {
				var myTimer:Timer = new Timer(5000);
				myTimer.addEventListener("timer", timerHandler);
				myTimer.start();
			}
			
			public function timerHandler(event:TimerEvent):void {
				PopUpManager.removePopUp(test);
			}

		]]>
	</fx:Script>

	<fx:Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
	</fx:Declarations>
	<s:Button x="245" y="270" label="Add PopUp" click="button1_clickHandler(event)"/>
</s:Application>

-----------------------------------------------------------------


Test.mxml (popUp)
-----------------------------------------------------------------
<?xml version="1.0" encoding="utf-8"?>
<s:Panel xmlns:fx="http://ns.adobe.com/mxml/2009" 
		 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			    height="200" width="200" addedEffect="{fadeIn}" removedEffect="{fadeOut}">
	
	<fx:Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
		<s:Fade id="fadeOut" duration="1000" alphaFrom="1.0" alphaTo="0.0"/>
		<s:Fade id="fadeIn" duration="1000" alphaFrom="0.0" alphaTo="1.0"/>
		
	</fx:Declarations>
	
	<s:Button label="Button"/>
</s:Panel>