EasyCFM.COM ColdFusion Forums / Flex Development / closing effects applied to popup titlewindow

   Reply to Discussion | New Discussion << previous || next >> 
Posted By Discussion Topic: closing effects applied to popup titlewindow -- page: 1 2

book mark this topic Printer-friendly Version  send this discussion to a friend  new posts last

zionist
05-02-2008 @ 7:50 AM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Junior Member
Posts: 94
Joined: Feb 2007

Hi how can i apply an effect to a popup titlewindow to shrink and move position when the close button of the titlewindow is clicked.

kicker
05-02-2008 @ 9:14 AM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Moderator
Posts: 717
Joined: Oct 2004

I would use a timer to be called when your close button is hit that would have a function that moves/shrinks your window and eventually close it. You will need to add an event listener to the titlewindow for the close event. Within that event listener function start a timer that has an event listener listening for the TimerEvent.Timer
then the function that handles that event use scaleX and scaleY to shrink the window in increments till it reaches the size you want before closing it all together. Something like below:




import flash.events.TimerEvent;
import flash.utils.Timer;

import mx.events.CloseEvent;

private var closeTimer:Timer = new Timer(10);


private function closeWindow(evt:CloseEvent):void
{
     closeTimer.addEventListener(TimerEvent.TIMER, shrinkWindow);
     closeTimer.start();
}

private function shrinkWindow(evt:TimerEvent):void
{
     if(myTitleWindow.scaleX <= 0)
     {
          myTitleWindow.visible
= false;
     }
     else
     {
          myTitleWindow.scaleX
-= .1;
          myTitleWindow.scaleY
-= .1;
     }
}


Then
just add the closeWindow to your titleWindow attribute called "close" like this:

<  mx:TitleWindow close="closeWindow(event)" />


And your window will shrink and eventually disappear. Play with the timer to have it happen faster or slower. Also the scaleX and Y have values between 0 and 1. One being full size and 0 being no measurable size. You can also check out transitions provided with AS3 and Flex. They have a few that can do alot of different effects, I don't use them because they don't give you much control for detailed effects, but there is one that will do the shrink effect. Another thing to look into.

Craig

This message was edited by kicker on 5-2-08 @ 9:14 AM

zionist
05-02-2008 @ 10:48 AM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Junior Member
Posts: 94
Joined: Feb 2007

hi what if the titlewindow is a custom component. the id attribute is not allowed on the root tag of a component so how do i refer to it in actionscript?

kicker
05-02-2008 @ 11:15 AM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Moderator
Posts: 717
Joined: Oct 2004

The custom component should be able to be given a id within the main application mxml file. It will look something like this:

<  ns:CustomComponent />

If you are calling the component through actionscript then you can still do what I displayed above just be altering the code a little, by changing the reference to the component to "this".

Craig

zionist
05-02-2008 @ 11:22 AM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Junior Member
Posts: 94
Joined: Feb 2007

hi thanks it worked. i used "this" in reference to the title window as you suggested. thanks alot

zionist
05-02-2008 @ 11:32 AM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Junior Member
Posts: 94
Joined: Feb 2007

sorry for disturbing you but how can i make it srink and change its x and y positions on the screen?

kicker
05-02-2008 @ 11:38 AM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Moderator
Posts: 717
Joined: Oct 2004

I would suggest looking into the (move) function.

Craig

zionist
05-02-2008 @ 11:45 AM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Junior Member
Posts: 94
Joined: Feb 2007

i have i move effect defined in mxml and i call it in the  close event like this;

private function closeWindow(evt:CloseEvent):void
               {
                    closeTimer.addEventListener(TimerEvent.TIMER, shrinkWindow);
                    closeTimer.start();
                    this.x = 500;
                this.y = 170;
                    customHide.end();
                customHide.play();
               }
customHide is the move effect id in mxml but nothing happens.

kicker
05-02-2008 @ 12:25 PM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Moderator
Posts: 717
Joined: Oct 2004

You may need to actually code the move instead of using the transition provided by flex. Again I would look into the "move" function of the TitleWindow component and use the timer code I showed you to move the object as it shrinks. When you start using multiple effects the results can be unpredictable. Especially since you are hard coding an effect and also using a effect Class. They can cancel each other out if not done exactly correct. Much like javascript does on occasion.

Craig

zionist
05-03-2008 @ 8:24 AM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Junior Member
Posts: 94
Joined: Feb 2007

this i gonna sound weak but let me ask anyway; i have never coded a move effect in action script i only know how to use the simple transition provided by flex in mxml. though i tried to code one but nothing happened. maybe its because i don't know how to make the shrink and move effects work in parallel. here is the move i coded.although i dont think it will give me the desired move since i want to move the titlewindow to x=990 and y=550 on the screen.
private function moveWindow(evt:TimerEvent):void
{
  this.x += 5;
  this.y += 5;                    
}


PAGE: 1 2

Website Designed and Developed by Pablo Varando.