Formatter類
Flex框架中的Formatter類。該類將數據格式化成字符串。所有的格式化類都是mx.formatters.Formatter類的子類，包括：
· CurrencyFormatter （格式化貨幣）
· DateFormatter （格式化日期）
· NumberFormatter （格式化數字）
· PhoneFormatter （格式化電話號碼）
· ZipCodeFormat （格式化郵政編碼）
Formatter類的使用
Formatter類也屬於非可視化元素，所以在程序中也必須放在Declarations標籤塊中。
· 所有的格式化類都有一個format()方法，在對象進行格式化時調用該方法；
· 每個格式化子類都有特別的屬性來自定義字符串的表現，這個屬性就是formatString
使用DateFormatter類格式化日期的顯示
效果如下圖：
沒有進行格式化的輸出時間：
進行格式化之後輸出的時間：
首先，創建一個 DateChooser 控件 ， id爲 dcCurrentTime ，如下 :
<mx:DateChooser id=" dcCurrentTime " />
之後，放置一個TextInput控件，如下：
<s:TextInput width=" 148 " id=" txtSelectTime " />
再次，在Declarations標籤中定義 DateFormatter 標籤，並設置其顯示的日期樣式，如下：
<fx:Declarations>
<mx:DateFormatter id=" dateInputFormator " formatString=" YYYY年-MM月-DD日 " />
</fx:Declarations>
最後，在TextInput控件的Text屬性上綁定 DateChooser 選擇的日期，並調用 DateFormatter 的 format()方法，對其顯示進行格式化，如下：
<s:TextInput width=" 148 " id=" txtSelectTime "
text=" { dateInputFormator.format(dcCurrentTime.selectedDate) } " />
使用Validator及其子類對數據進行驗證
Flex框架中有衆多的數據驗證類，它們都繼承自Validator類，常用的有：
· CreditCardValidator，信用卡賬號驗證；
· Currency，貨幣驗證；
· DateValidator，日期驗證；
· EmailValidator，郵件格式驗證；
· NumberValidator，數字格式驗證；
· ……
Validator 類的使用
如同Formatter類一樣，Validator也屬於非可視化元素，所以在程序中也必須放在Declarations標籤塊中。
· Validator類的source屬性，用於綁定你要驗證對象的實體名稱；
· property屬性用於定義你要驗證對象屬性的名稱，比如：你驗證一個文本框的text屬性，就用該屬性進行設置；
· trigger屬性與觸發驗證對象的實體名稱綁定；例如：按鈕觸發該驗證；
· triggerEvent屬性爲觸發驗證對象指定一個事件，告訴程序當觸發了哪一個事件之後就進行驗證操作；比如：按鈕的click事件；
使用 NumberValidator 對數字進行驗證
效果如下圖：
首先，創建一個FormItem標籤，將其屬性設置爲true，用於顯示"小時數"前面的紅色星號，表示該項爲必填項，之後創建TextInput標籤，設置其Id屬性，如下：
<mx:FormItem required=" true " >
<s:Label text=" 小時數： " id=" lblHours " />
<s:TextInput id=" hourInput " width=" 148 " />
</mx:FormItem>
然後，在 Declartions標籤中創建 一個 NumberValidator 標籤，如下：
<mx:NumberValidator id=" hourValidator " precision=" 2 " allowNegative=" false "required=" true "source=" { hourInput } " property=" text " trigger=" { submitButton } " triggerEvent=" click " />
其中， precision 屬性設置小數點之後保留兩位；
allowNegative 屬性表示不能爲負數；
required 屬性表示該項必須有內容；
source屬性表示要驗證的對象是文本框 hourInput ；
Property 屬性要驗證 文本框對象的text屬性；
Trigger 屬性表示只有 id爲 submitButton 的按鈕可以觸發驗證；
triggerEvent 屬性表示當 id爲 submitButton 的按鈕觸發 click事件時，同時觸發文本框的驗證。
最後，創建出來Button按鈕對象，並設置其Id屬性；如下：
<s:Button label=" 提交 " id=" submitButton " />
此時就利用 NumberValidator 類 完成了一個對數字數據的驗證。
當然，可以使用ActionScript代替MXML命令來觸發驗證。 每個Validator類都有一個validate()方法可以觸發驗證。Validator類還有一個靜態的validateAll()方法，可以用來一次性觸發多個Validator實體的驗證。
上面的程序可以按照以下步驟修改，使用Validator的validate方法來觸發驗證：
首先，去除 NumberValidator 標籤中的 trigger屬性，將 triggerEvent 的事件設置爲空白；如下：
< mx:NumberValidator id=" hourValidator " precision=" 2 " allowNegative=" false "
required=" true " source=" { hourInput } " property=" text " triggerEvent="" />
然後，在Script標籤中建立一個私有的無參的無返回值類型的方法，在這個方法中創建一個ValidationResultEvent類型的本地變量，將數字驗證器對象的validate()方法返回的值賦給這個本地變量；如下：
<fx:Script>
<![CDATA[
import mx.events.ValidationResultEvent;
private function validateHours(): void
{
var event:ValidationResultEvent = hourValidator.validate();
}
]]>
</fx:Script>
最後，在 Button按鈕中的Click事件中調用這個方法，如下：
<mx:FormItem>
<s:Button label=" 提交 " id=" submitButton " click="validateHours()" />
</mx:FormItem>
其顯示效果與上面相同。
使用 EmailValidator 和 DateValidator 驗證郵箱和日期
顯示效果如下圖：
當點擊 "提交"按鈕時，文本框全部顯示爲紅色邊框，並顯示相應的信息提示，表示數據不合法；
跟以上不同的是，現在需要對時間、小時數和郵箱同時進行驗證，所以首先在Declarations標籤中添加 EmailValidator 和 DateValidator 標籤，以對郵箱和時間進行驗證，如下：
< mx:EmailValidator id=" emailValidator " source=" { txtEmail } "
property=" text " triggerEvent="" />
<mx:DateValidator id=" dateTiemValidator " source=" { txtSelectTime } "
property=" text " triggerEvent="" />
同時爲各個文本框加上id屬性， 如下：
<mx:FormItem required=" true " >
<s:Label text=" 您選擇的時間爲： " id=" lblSelectTime " />
<s:TextInput width=" 148 " id=" txtSelectTime "
text=" { dateInputFormator.format(dcCurrentTime.selectedDate) } " />
</mx:FormItem>
<mx:FormItem required=" true " >
<s:Label text=" 小時數： " id=" lblHours " />
<s:TextInput id=" txtHourInput " width=" 148 " />
</mx:FormItem>
<mx:FormItem required=" true " >
<s:Label text=" 郵箱： " id=" lblEmail " />
<s:TextInput width=" 148 " id=" txtEmail " />
</mx:FormItem>
然後，將以上在 Script代碼塊中定義 validateHours() 的方法去掉，改爲以下方法，用於驗證對所有的輸入框進行數據驗證。如下：
<fx:Script>
<![CDATA[
import mx.validators.Validator;
private function validateForm(): void
{
Var validationArry:Array = Validator.validateAll([hourValidator,emailValidator,dateTiemValidator]);
}
]]>
</fx:Script>
Validator類還有一個靜態的validateAll()方法，可以用來一次性觸發多個Validator實體的驗證。該方法有一個數組類型的參數，可以 將所有的驗證器以數組的的形式傳入 ，然後返回一個ValidationResultEvent數組，根據數組的長度來判斷Validator是否驗證成功。如果返回的數組長度爲0，則說明驗證成功。
最後，在Button按鈕的click屬性中調用 validateForm() 方法。此時就可以完成以上的所有數據驗證。
完整的示例代碼如下：
<?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/halo " minWidth=" 1024 " minHeight=" 768 " >
<!-- ———————————— 父類屬性 ———————————— -->
<s:layout>
<s:BasicLayout/>
</s:layout>
<!-- ———————————— 腳本 ———————————— -->
<fx:Script>
<![CDATA[
import mx.validators.Validator;
private function validateForm(): void
{
var validationArry:Array = Validator.validateAll([hourValidator,emailValidator,dateTiemValidator]);
}
]]>
</fx:Script>
<!-- ———————————— 聲明 ———————————— -->
<fx:Declarations>
<mx:DateFormatter id=" dateInputFormator " formatString=" YYYY年-MM月-DD日 " />
<mx:NumberValidator id=" hourValidator " precision=" 2 " allowNegative=" false "
required=" true " source=" { txtHourInput } " property=" text "
triggerEvent="" />
<mx:EmailValidator id=" emailValidator " source=" { txtEmail } "
property=" text " triggerEvent="" />
<mx:DateValidator id=" dateTiemValidator " source=" { txtSelectTime } "
property=" text " triggerEvent="" />
</fx:Declarations>
<!-- ———————————— UI組件 ———————————— -->
<mx:Form x=" 321 " y=" 83 " >
<mx:FormHeading label=" 日期格式化和數據的有效性驗證 " />
<s:Label text=" 當前時間 " id=" lblCurrentTime " />
<mx:DateChooser id=" dcCurrentTime " />
<mx:FormItem required=" true " >
<s:Label text=" 您選擇的時間爲： " id=" lblSelectTime " />
<s:TextInput width=" 148 " id=" txtSelectTime " text=" { dateInputFormator.format(dcCurrentTime.selectedDate) } " />
</mx:FormItem>
<mx:FormItem required=" true " >
<s:Label text=" 小時數： " id=" lblHours " />
<s:TextInput id=" txtHourInput " width=" 148 " />
</mx:FormItem>
<mx:FormItem required=" true " >
<s:Label text=" 郵箱： " id=" lblEmail " />
<s:TextInput width=" 148 " id=" txtEmail " />
</mx:FormItem>
<mx:FormItem>
<s:Button label=" 提交 " id=" submitButton " click="validateForm()" />
</mx:FormItem>
</mx:Form>
</s:Application>
http://blog.163.com/qqabc20082006@126/blog/static/229285252010349915628/