YJQDateField.mxml
<?xml version="1.0" encoding="utf-8"?>
<s:HGroup xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
horizontalAlign="left"
width="176" height="22">
<fx:Declarations>
<!-- 将非可视元素（例如服务、值对象）放在此处 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.controls.DateField;
import mx.core.FlexGlobals;
import mx.core.INavigatorContent;
import mx.formatters.DateFormatter;
import mx.managers.PopUpManager;
[Bindable]
/**
* 控件是否可以直接输入日期
*/
public var editable:Boolean;
[Bindable]
/**
* 日期格式 YYYY MM DD HH NN SS
*/
public var formatString:String ="YYYY-MM-DD HH:NN:SS";
[Bindable]
private var _date:Date = new Date();
private var _year:int=0,_month:int=0,_day:int=0,_hour:int=0,_minute:int=0,_second:int=0;
/**
* 设置显示日期字符串
*/
public function set text(value:String):void
{
_date=DateFormatter.parseDateString(value);
}
/**
* 设置日期
*/
public function set date(value:Date):void
{
_year = value.fullYear;
_month = value.month;
_day =value.day;
_minute=value.minutes;
_hour=value.hours;
_second=value.seconds;
_date = value;
}
/**
* 获取控件时间
*/
public function get date():Date
{
return _date;
}
/**
* 获取Chooser日期
*/
public function onGetDate(y:int,mo:int,d:int,h:int,mi:int,s:int):void
{
this._year=y;
this._month = mo;
this._day = d;
this._hour = h;
this._minute = mi;
this._second = s;
_date = new Date(_year,_month,_day,_hour,_minute,_second);
_inSelected = false;
}
private var _inSelected:Boolean = false;
/**
* 选择年月日
*/
protected function chooseDate_LBtn_clickHandler(event:MouseEvent):void
{
// TODO Auto-generated method stub
if(_inSelected == true)
return ;
var dateChooser:YJQChooseDate = new YJQChooseDate();
dateChooser.setDate(date.fullYear,date.month,date.date,date.hours,date.minutes,date.seconds);
dateChooser.onReturnTime = onGetDate;
dateChooser.cancelHandler = function():void
{
_inSelected = false;
}
dateChooser.x = event.stageX;
dateChooser.y = event.stageY;
PopUpManager.addPopUp(dateChooser,FlexGlobals.topLevelApplication as DisplayObject);
_inSelected = true;
}
private function DateToString(d:Date,format:String):String
{
//YYYY-MM-DD HH:NN:SS
var str:String = format;
str=str.replace("YYYY",d.fullYear);
str = str.replace("MM",d.month+1);
str=str.replace("DD",d.date);
str=str.replace("HH",d.hours);
str=str.replace("NN",d.minutes);
str=str.replace("SS",d.seconds);
return str;
}
override public function toString():String
{
return DateToString(_date,formatString);
}
]]>
</fx:Script>
<s:TextInput id="date_input" text="{DateToString(_date,formatString)}" height="100%" width="100%" />
<mx:LinkButton label=">>" id="chooseDate_LBtn" click="chooseDate_LBtn_clickHandler(event)" />
</s:HGroup>
YJQChooseDate.mxml
<?xml version="1.0" encoding="utf-8"?>
<s:BorderContainer 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="200" maxWidth="200"
minHeight="260" maxHeight="260"
width="200" height="260">
<fx:Declarations>
<!-- 将非可视元素（例如服务、值对象）放在此处 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.events.FlexEvent;
import mx.managers.PopUpManager;
/**
* year month day hour minute second
*/
public var onReturnTime:Function;
[Bindable]
private var _hour:int = 0;
[Bindable]
private var _minute:int =0;
[Bindable]
private var _second:int =0;
private var _year:int,_month:int,_day:int;
/**
* 设置日期
*/
public function setDate(year:int,month:int,day:int ,hour:int,minute:int,second:int):void
{
_year=year;
_month=month;
_day=day;
_hour = hour;
_minute=minute;
_second=second;
}
/**
* 输入小时是否合理
*/
protected function hour_focusOutHandler(event:FocusEvent):void
{
if(isNaN(Number(hour.text)))
{
hour.text=_hour.toString();
return;
}
_hour = int(hour.text);
if(_hour<0)
_hour=0;
else if(_hour>23)
_hour=23;
hour.text = _hour.toString();
}
/**
* 输入分钟是否合理
*/
protected function minute_focusOutHandler(event:FocusEvent):void
{
if(isNaN(Number(minute.text)))
{
minute.text=_minute.toString();
return;
}
_minute = int(minute.text);
if(_minute<0)
_minute=0;
else if(_minute>59)
_minute=59;
minute.text = _minute.toString();
}
/**
* 输入秒是否合理
*/
protected function second_focusOutHandler(event:FocusEvent):void
{
if(isNaN(Number(second.text)))
{
second.text=_second.toString();
return;
}
_second = int(second.text);
if(_second<0)
_second=0;
else if(_second>59)
_second=59;
second.text = _second.toString();
}
/**
* 双击代表选择
*/
protected function vgroup1_doubleClickHandler(event:MouseEvent):void
{
ok_clickHandler(null);
}
/**
* 返回日期
*/
protected function ok_clickHandler(event:MouseEvent):void
{
// TODO Auto-generated method stub
var date:Date = dateChosser.selectedDate;
onReturnTime(date.fullYear,date.month,date.day,_hour,_minute,_second);
try
{
PopUpManager.removePopUp(this);
}
catch(error:Error)
{
this.parent.removeChild(this);
}
}
public var cancelHandler:Function;
/**
* 取消日期选择
*/
protected function cancel_clickHandler(event:MouseEvent):void
{
try
{
PopUpManager.removePopUp(this);
}
catch(error:Error)
{
this.parent.removeChild(this);
}
cancelHandler();
}
/**
* DateChooser加载完成后执行
*/
protected function dateChosser_creationCompleteHandler(event:FlexEvent):void
{
// TODO Auto-generated method stub
dateChosser.selectedDate .setFullYear(_year,_month,_day);
}
]]>
</fx:Script>
<s:VGroup width="100%" height="100%" >
<mx:DateChooser width="100%" id="dateChosser" >
</mx:DateChooser>
<s:HGroup paddingTop="0" paddingLeft="10" width="100%" horizontalAlign="left">
<s:TextInput id="hour" width="23" text="{this._hour.toString()}" focusOut="hour_focusOutHandler(event)" />
<s:Label paddingTop="4" text="时:" />
<s:TextInput id="minute" width="21" text="{this._minute.toString()}" focusOut="minute_focusOutHandler(event)"/>
<s:Label paddingTop="4" text="分:" />
<s:TextInput id="second" width="22" text="{this._second.toString()}" focusOut="second_focusOutHandler(event)"/>
<s:Label paddingTop="4" text="秒:" />
</s:HGroup>
<s:HGroup width="100%" horizontalCenter="true" >
<s:Button label="确定" id="ok" click="ok_clickHandler(event)" />
<mx:Spacer width="100%" />
<s:Button label="取消" id="cancel" click="cancel_clickHandler(event)" />
</s:HGroup>
</s:VGroup>
</s:BorderContainer>
测试文件
<?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"
creationComplete="application1_creationCompleteHandler(event)"
xmlns:supportClasses="com.esri.ags.skins.supportClasses.*"
minWidth="955" minHeight="600" xmlns:YJQDateField="YJQDateField.*">
<s:layout>
<supportClasses:AttachmentLayout/>
</s:layout>
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.events.FlexEvent;
import mx.formatters.DateFormatter;
protected function application1_creationCompleteHandler(event:FlexEvent):void
{
// TODO Auto-generated method stub
var date:Date = DateFormatter.parseDateString("2011-08-06 14:21:25");
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 将非可视元素（例如服务、值对象）放在此处 -->
</fx:Declarations>
<YJQDateField:YJQDateField />
</s:Application>