Macromedia flex 2 Manual

Defining a custom effect trigger

249

The application in the following example uses the MyButton control. The 

darkenEffect

 and 

brightenEffect

 properties are set to the FadeOut and FadeIn effects, respectively. The 

click

 event of a second Button control toggles the MyButton control’s 

bright

 property and 

executes the corresponding effect (FadeOut or FadeIn). 

<?xml version="1.0"?>
<!-- effects/MainMyButton.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    xmlns:MyComp="myComponents.*" >

    <!-- Define two fade effects for darkening and brightening target. -->
    <mx:Fade id="FadeOut" duration="1000" alphaFrom="1.00" alphaTo=".20"/>
    <mx:Fade id="FadeIn" duration="1000" alphaFrom=".20" alphaTo="1.00"/>

    <!-- Define custom button that defines the 
        darkenEffect and brightenEffect. -->
    <MyComp:MyButton 
        label="MyButton" id="btn" 
        darkenEffect="{FadeOut}" 
        brightenEffect="{FadeIn}" 
        darken="debugW.text='got darken event';" 
        brighten="debugW.text='got brighten event';"/>
  
    <!-- Define button that triggers darken event. -->
    <mx:Button 
        label="set bright to false" 
        click="btn.bright = false; myTA.text=String(btn.bright);"/> 
    
    <!-- Define button that triggers brighten event. -->
    <mx:Button 
        label="set bright to true" 
        click="btn.bright = true; myTA.text=String(btn.bright);"/> 
    
    <!-- TextArea displays the current value of bright. --> 
    <mx:TextArea id="myTA" />
    
    <!-- TextArea displays event messages. -->  
    <mx:TextArea id="debugW" />

    <!-- Define button to make sure effects working. -->
    <MyComp:MyButton id="btn2" label="test effects" 
        mouseDownEffect="{FadeOut}" 
        mouseUpEffect="{FadeIn}"/>
    
</mx:Application>