Blur

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" verticalAlign="top"

    horizontalAlign="center" backgroundGradientColors="[#682525, #5C0D0D]" paddingTop="0" viewSourceURL="srcview/index.html" backgroundGradientAlphas="[1.0, 1.0]">

   

    <mx:Blur id="blurImage" duration="1000"

        blurXFrom="0.0" blurXTo="10.0"

        blurYFrom="0.0" blurYTo="10.0"/>

    <mx:Blur id="unblurImage" duration="1000"

        blurXFrom="10.0" blurXTo="0.0"

        blurYFrom="10.0" blurYTo="0.0"/>

       

    <mx:Panel title="Blur Effect" layout="vertical" color="0xffffff" borderAlpha="0.15" width="500"

         paddingTop="10" paddingRight="10" paddingBottom="10" paddingLeft="10" horizontalAlign="center" top="10" left="10">

        

         <mx:Text width="100%" color="0x323232" textAlign="center" paddingBottom="10"

            text="Click and hold the mouse on the image to see blurImage effect. Release the mouse to see the unblurImage effect."/>

        <mx:Image id="flex" source="@Embed('images/compass.jpg')" mouseDownEffect="{blurImage}" mouseUpEffect="{unblurImage}"/>

    </mx:Panel>

   

</mx:Application>