1 Reply Latest reply on Aug 23, 2010 5:56 AM by Vackar

    Apply rollover and rollout effect for Button

    Flex Rock Level 1

      Hi,

            I have a button, I need to set the rollover or mouseover and rollout or mouseout of button with different colors.

      Give me  a sample please.

       

      Regards,

      Jayagopal P.S

        • 1. Re: Apply rollover and rollout effect for Button
          Vackar Level 2

          Try This. Create a blank application, then add this. I haven't compiled it - just off the top of my head so it may contain some errors.

          Note: this is flex 3 syntax

           

          <mx:Button id="btn"
               rollOver="{handleMouseOver(event)}"
               rollOut="{handleMouseOut(event)}"
          />
          
          <mx:states>
                <mx:State name="{state_normal}">
                     <mx:SetStyle target="{btn}" name="backgroundColor" value="#000000" />    
                </mx:State>
               <mx:State name="{state_mouseover}">
                     <mx:SetStyle target="{btn}" name="backgroundColor" value="#ffffff" />    
                </mx:State>
          </mx:states>
          
                <mx:Script>
                  <![CDATA[
          
                    private static const state_normal:String = "0";
                        private static const state_mouseover:String = "1";
          
                     public  function handleMouseOver(event:MouseEvent) {
                           this.currentState = state_mouseover;
                     }
                      
                     public  function handleMouseOut(event:MouseEvent) {                 
                           this.currentState = state_normal;
                     }
          
                     ]]>
               </mx:Script>
          

           

           

          Thanks,

          Vackar