Flex4 格式化功能和验证功能示例

Flex4中支持的格式化功能有很多，其都是mx.formatters.Formatter的子类。常见的主要有CurrencyFormatter/DataFormatter/NumberFormatter等。子类必须重写format()方法来实现自定义格式化方案。

验证功能的提供类都是mx.validators.Validator的子类。其中如果将Validator中required属性为TRUE，则被验证的字段为必录项。常见的验证器有CreditCardValidator/CurrencyValidator/DateValidator/EmailValidator等。

格式化和验证诸多类实际使用类似，这里写一个货币为例的验证器和格式化器。

<?xml version="1.0" encoding="utf-8"?>
<s:Application
  xmlns:fx="http://ns.adobe.com/mxml/2009"
  xmlns:s="library://ns.adobe.com/flex/spark"
  xmlns:mx="library://ns.adobe.com/flex/mx"
  width="100%" height="100%">
<fx:Script><![CDATA[
	//focusOut 事件相应
  protected function currencyTIFocusOutHandler(event:FocusEvent):void {
    var formattedText:String =
      currencyFormatter.format(money.text);
    if (formattedText != "") {
      money.text = formattedText;
    }
  }
]]></fx:Script>
<fx:Declarations>
	<!--格式化采用四舍五入，精确到分（美分）-->
  <mx:CurrencyFormatter id="currencyFormatter"
    precision="2" rounding="nearest"/>
	<!--验证器来源来自数据绑定的TextInput-->
  <mx:CurrencyValidator id="currencyValidator" precision="2"
    source="{money}" property="text" triggerEvent="focusOut"/>
</fx:Declarations>
  <s:layout>
    <s:VerticalLayout paddingTop="10" paddingLeft="10"/>
  </s:layout>
  <s:TextInput id="money"
    focusOut="currencyTIFocusOutHandler(event)"/>
  <s:Button label="用于转移焦点的按钮！打酱油……"/>
</s:Application>

首先在文本框中输入金额，然后点击“打酱油”的按钮用来转移焦点，如果金额正确则格式化完毕校验通过。

如果没有输入直接转移焦点则提示“This field is required”。

如果输入的不是数字则提示‘The input contains invalid characters.’

其他解释在程序注释中。

Flex4 格式化功能和验证功能示例,布布扣,bubuko.com