2 Replies Latest reply on Jul 19, 2010 8:38 AM by rtalton

    How to make a glow effect flash on/off

    iamcootis Level 1

      I am fairly new to effects and not sure exactly how they work. I would like to add a glow effect around an image and have it flash on and off to a timer. How would I make this happen? Thanks for your help.

       

      This is my glow effect:

       

      <mx:Glow id="glowImage"
              alphaFrom="1.0" alphaTo="0.3"
              blurXFrom="0.0" blurXTo="50.0"
              blurYFrom="0.0" blurYTo="50.0"
              color="green" duration="1000"/>
          <mx:Glow id="unglowImage" duration="1000"
              alphaFrom="0.3" alphaTo="1.0"
              blurXFrom="50.0" blurXTo="0.0"
              blurYFrom="50.0" blurYTo="0.0"
              color="green"/>

       

      Here is my image

       

      <mx:Image  id="checkMark" source="@Embed(source='assets/CheckMark.png')" visible="{showCheckMark}" />

        • 1. Re: How to make a glow effect flash on/off
          BhaskerChari Level 4

          Hi cootis,

           

          Check the below code which Flashes GlowEffect on and off based on the timer..

           

           

          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
          layout="vertical"
          backgroundAlpha="0"
          backgroundColor="#FFFFFF"
          creationComplete="init()">
          <mx:Script>
            <![CDATA[
            
             private var timer:Timer = new Timer(1000, 2);
            
             private function init():void
             {
              glowImage.target = checkMark;
              unglowImage.target = checkMark;
              timer.addEventListener(TimerEvent.TIMER_COMPLETE, onTimerComplete);
              timer.start();
              glowImage.play();
             }
             private function onTimerComplete(event:TimerEvent):void
             {
              timer.stop();
              timer.reset();
              timer.start();
              unglowImage.play();
             }
             private function startGlowEffect():void
             {
              glowImage.play();
             }
            ]]>
          </mx:Script>

          <mx:Glow id="glowImage"
                  alphaFrom="1.0" alphaTo="0.3"
                  blurXFrom="0.0" blurXTo="50.0"
                  blurYFrom="0.0" blurYTo="50.0"
                  color="green" duration="1000"/>
              <mx:Glow id="unglowImage" duration="1000" effectEnd="startGlowEffect();"
                  alphaFrom="0.3" alphaTo="1.0"
                  blurXFrom="50.0" blurXTo="0.0"
                  blurYFrom="50.0" blurYTo="0.0"
                  color="green"/>
          <mx:Image id="checkMark" source="@Embed(source='assets/Rose20Icon.jpg')" />
          </mx:Application>

           

          If this post answers your question or helps, please kindly mark it as such.

           

          Note: You can change the timer time to match your requirement to play the effect.

           

          I am playing the Glow effect as soon as the the UnGlow effect is finished...If you want to have a gap or start the GlowEffect on some button click..you just call startGlowEffect() function at that time instead.


          Thanks,

          Bhasker Chari

          • 2. Re: How to make a glow effect flash on/off
            rtalton Level 4

            You an also check out Chet Haase's excellent blog on all things regarding effects.

            Here is a good example on how to animate the glow:

            http://graphics-geek.blogspot.com/search?q=glow