It’s tax season here in the US until April 15th. I decided to get an early start. I opened up TurboTax(tax software). After entering some numbers, you will notice the little “Federal Refund” ticker at the top that keeps a running total of the money you will get, or owe, based on all the numbers entered. The refund ticker also has a cool animation on it when it goes up or down. I quickly got bored of doing my taxes and instead decided to write the little number changer component in Flex.
<?xml version=”1.0? encoding=”utf-8??>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”vertical”>
<mx:Script>
<![CDATA[
[Bindable] private var currentNumber:int = 0;
private var difference:Number;
private function buttonClick():void
{
difference = numberInput.value - currentNumber;
timer.addEventListener(TimerEvent.TIMER, timerExecute);
doTimer();
}
private var timer:Timer = new Timer(1,0);
private function doTimer():void
{
if(currentNumber<numberInput.value && difference >0)
{
if(numberInput.value-currentNumber < difference/350)
{
currentNumber = numberInput.value;
}
else
{
currentNumber+=difference/350;
timer.start();
greenGlow.play();
}
}
else if(currentNumber>numberInput.value && difference <0)
{
if(currentNumber - numberInput.value < difference/-350)
{
currentNumber = numberInput.value;
}
else
{
currentNumber-=difference/-350;
timer.start();
redGlow.play();
}
}
else
{
timer.stop();
greenGlow.stop();
redGlow.stop();
}
setColor();
}
private function setColor():void
{
var newColor:String = currentNumber>=0?’green’:’red’;
if(currentNumber==0)
newColor = ‘black’;
numberLabel.setStyle(’color’, newColor);
}
private function timerExecute(event:TimerEvent):void
{
doTimer();
}
]]>
</mx:Script>
<mx:CurrencyFormatter id=”currencyFormatter” precision=”2? useThousandsSeparator=”true”/>
<mx:Box id=”box” borderThickness=”1? borderStyle=”solid” backgroundColor=”#FFFFFF” borderColor=”#000000? dropShadowEnabled=”true” width=”200? horizontalAlign=”right”>
<mx:Label id=”numberLabel” text=”{currencyFormatter.format(currentNumber)}” fontWeight=”bold” fontSize=”22? creationComplete=”setColor()” fontFamily=”Courier New”/>
</mx:Box>
<mx:Glow color=”red” id=”redGlow” target=”{box}” duration=”1000?/>
<mx:Glow color=”green” id=”greenGlow” target=”{box}” duration=”1000?/>
<mx:Spacer height=”100?/>
<mx:NumericStepper maximum=”10000000? id=”numberInput” value=”20000? minimum=”-1000000? stepSize=”1000?/>
<mx:Button click=”buttonClick()” label=”Render”/>
</mx:Application>
