众所周知,flex自带的时间控件(DateField和DateChooser)都不能输入时间(即:时分秒)的信息。
下面共享的组件是自定义的时间组件(TimeField、TimeChooser和TimeTextInput)。
前面两个,顾名思义,是仿照flex系统组件封装的。使用上也和系统组件一样,当然,功能可能没有系统组件那么完善。至于最后一个,是类似textinput的时间输入组件。
效果分别如下:
TimeChooser:

----------------------------------------------------
TimeField:

------------------------------------------------------
TimeTextInput:

-----------------------------------------------------------------------------
使用范例如下:
<?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" minWidth="955" minHeight="600" xmlns:timeChooser="vendy.com.time.timeChooser.*" xmlns:timeField="vendy.com.time.timeField.*" xmlns:time="vendy.com.time.*">
<fx:Script>
??<![CDATA[
? ?
? ?import vendy.com.common.helper.DateHelper;
? ?[Bindable]public var date:Date=new Date();
? ?
? ?[Bindable]public var dateStr:String="2011/01/01 12:11:11";
??]]>
</fx:Script>
<fx:Declarations>
??<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<s:layout>
??<s:VerticalLayout horizontalAlign="center"/>
</s:layout>
<timeField:TimeField/>
<s:TextInput??text="{DateHelper.dateToString(date,'YYYY/MM/DD JJ:NN:SS')}" width="300" />
<s:TextInput text="{dateStr}"/>
<timeChooser:TimeChooser maxYear="2012" minYear="1982" selectedDateStr="@{dateStr}"/>
<time:TimeTextInput/>
</s:Application>
本组件是开放源码的。也许因为能力有限,大家使用中可能会发现某些bug吧。大家可以找我进行修正或自己修改源码完善它,但,请留言说明,共享经验,谢谢!
源码地址:http://code.google.com/p/vendy-time-flex/ ? ?or
http://code.google.com/p/vendy-time-flex/downloads/list ?