Flex中创建一个简单计算器的例子

接下来的例子演示了flex中创建一个简单计算器。严格来说这个还不能算是计算器，只是简单的计算了增加百分比的计算。在“amount”中输入数字并拖动滑标，可以看到计算结果。
复制代码代码如下:<?xml version="1.0" encoding="utf-8"?>
<mx:application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalalign="middle"
        backgroundcolor="white">
 
    <mx:script>
        <![cdata[
            private function updatetotal():void {
                var amt:number = parsefloat(amount.data.tostring());
                if (isnan(amt)) {
                    total.text = "not a number";
                    return;
                }
                var tipamt:number = amt * tip.value/100;
                total.text = currencyformatter.format(tipamt + amt);
            }
 
            private function datatipfunc(item:number):string {
                var amt:number = parsefloat(amount.data.tostring());
                var tipamt:number = amt * item/100;
                return item + "% (" + currencyformatter.format(tipamt) + ")";
            }
 
            private function amount_focusout(evt:focusevent):void {
                amount.data = number(amount.text).tofixed(2);
                amount.text = currencyformatter.format(amount.data);
            }
 
            private function amount_focusin(evt:focusevent):void {
                amount.text = amount.data.tostring();
            }
        ]]>
    </mx:script>
 
    <mx:currencyformatter id="currencyformatter" precision="2" />
 
    <mx:form>
        <mx:formheading label="tip calculator" />
        <mx:formitem label="amount:">
            <mx:textinput id="amount"
                    data="0"
                    restrict="0-9."
                    change="updatetotal();"
                    focusout="amount_focusout(event);"
                    focusin="amount_focusin(event);" />
        </mx:formitem>
        <mx:formitem label="tip:">
            <mx:hslider id="tip"
                    minimum="0"
                    maximum="30"
                    value="15"
                    labels="[0,5,10,15,20,25,30]"
                    snapinterval="1"
                    tickinterval="5"
                    livedragging="true"
                    change="updatetotal();"
                    showtrackhighlight="true"
                    datatipformatfunction="datatipfunc" />
        </mx:formitem>
        <mx:formitem label="total:" fontweight="bold">
            <mx:label id="total" />
        </mx:formitem>
    </mx:form>
 
</mx:application>