Flex中利用CurrencyValidator和CurrencyFormatter类验证并且格式化数字的例子

By Minidxer | August 3, 2008

接下来的例子演示了Flex中如何利用CurrencyValidator和CurrencyFormatter类，验证并且格式化数字。

让我们先来看一下Demo（可以右键View Source或点击这里察看源代码）：


下面是完整代码(或点击这里察看)：

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.  
  7.     <mx:Script>
  8.         <![CDATA[
  9.             [Bindable]
  10.             [Embed(source="assets/bulletCheck.png")]
  11.             public var BulletCheck:Class;
  12.  
  13.             [Bindable]
  14.             [Embed(source="assets/bulletCritical.png")]
  15.             public var BulletCritical:Class;
  16.         ]]>
  17.     </mx:Script>
  18.  
  19.     <mx:Script>
  20.         <![CDATA[
  21.             import mx.controls.TextInput;
  22.             import mx.events.ValidationResultEvent;
  23.  
  24.             private function formatString(evt:FocusEvent):void {
  25.                 var ti:TextInput = TextInput(evt.currentTarget);
  26.                 if (validateCurrency()) {
  27.                     ti.data = ti.text;
  28.                     ti.text = currencyFormatter.format(ti.data);
  29.                 } else {
  30.                     ti.setFocus();
  31.                 }
  32.             }
  33.  
  34.             private function unformatString(evt:FocusEvent):void {
  35.                 var ti:TextInput = TextInput(evt.currentTarget);
  36.                 ti.text = String(ti.data);
  37.             }
  38.  
  39.             private function validateCurrency():Boolean {
  40.                 var isValid:Boolean = false;
  41.                 var result:ValidationResultEvent = currencyValidator.validate();
  42.                 switch (result.type) {
  43.                     case ValidationResultEvent.VALID:
  44.                         isValid = true;
  45.                         image.source = BulletCheck;
  46.                         break;
  47.                     case ValidationResultEvent.INVALID:
  48.                         currencyValidator.source.setFocus();
  49.                         image.source = BulletCritical;
  50.                         break;
  51.                 }
  52.                 return isValid;
  53.             }
  54.         ]]>
  55.     </mx:Script>
  56.  
  57.     <mx:CurrencyFormatter id="currencyFormatter"
  58.             currencySymbol="$"
  59.             useThousandsSeparator="true"
  60.             precision="2" />
  61.  
  62.     <mx:CurrencyValidator id="currencyValidator"
  63.             currencySymbol="$"
  64.             source="{textInput}"
  65.             property="text" />
  66.  
  67.     <mx:Form>
  68.         <mx:FormHeading label="Enter base price" />
  69.         <mx:FormItem label="Price:" direction="horizontal" required="true">
  70.             <mx:TextInput id="textInput"
  71.                     data=""
  72.                     focusIn="unformatString(event)"
  73.                     focusOut="formatString(event)" />
  74.             <mx:Image id="image" verticalAlign="bottom" width="20"  />
  75.         </mx:FormItem>
  76.         <mx:FormItem>
  77.             <mx:Button id="button"
  78.                     label="Validate"
  79.                     click="validateCurrency()" />
  80.         </mx:FormItem>
  81.     </mx:Form>
  82.  
  83. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: Flex | No Comments » | Tags: , , ,

你可能还对下列文章感兴趣:

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll