DateField 也是一個日期選擇組件，點擊會調用 DateChooser 組件，一般用于日期的選擇。
創建 DateField 的方式很簡單，如：

< mx : DateField ? id = 'date1' ? width = '120' ? />
可以使用 dateFormatter 屬性格式化日期顯示結果

1. < mx : Script > ?

2. <![ CDATA [ ?

3. function ? formatDate ( date : Date ): String ?

4. { ? ?

5. return ? date . getUTCDate () ? + ? '/' ? + ? ( ? date . getUTCMonth () ? + ? 1 ? ) ? + ? '/' ? +

6. date . getUTCFullYear (); ?

7. ? } ?

8. ]]>
9. </ mx : Script >

10.? < mx : DateField ? id = 'date1' ? dateFormatter = 'formatDate' ? width = '100' ? />
顯示效果如圖
如果要設置日歷的格式，也需要設置 DateField 組件中的相關屬性，這些和 DateChooser 組件的設置方法相同。這個時候如果也用 MXML 標記來設置的話，恐怕就比較麻煩了，所以應該養成用 AS 腳本來設置組件的習慣。這里就不多說了。基本上 DateField 組件的使用和 DateChooser 差不多，掌握了 DateChooser 組件， DateField 自然就不成問題。
另外注意知道的是 DateField 組件比 DateChooser 組件多了兩個事件：
open 點擊打開 DateChooser 組件的事件響應
close 用戶選擇了日期或者在 DateChooser 組件之外點擊的事件響應
下面的例子在選擇了日期后會彈出對話框提示選擇的結果

1. < mx : Script >

2. <![ CDATA [

3. function ? showSelectedDate ( eventObj ): String

4. { ?

5. return ? eventObj . target . selectedDate . getDate () ? + ? '/' ? + ? ?

6. ( ? eventObj . target . selectedDate . getMonth () ? + ? 1 ? ) ? + ? '/' ? +

7. eventObj . target . selectedDate . getFullYear (); ?

8. ? } ?

9. ]]>

10.? </ mx : Script >

11.? < mx : DateField ? id = 'date1' ? close = 'alert(showSelectedDate(event))' ? width = '100' ? />