前段时间要用到带时分秒的flex日历选择器。到网上找了些资料,再自己改改,有了以下成果:
以下是所有代码:
myDateChooser.cs
view plain copy to clipboard print ?
- package nmsDateField
- {
- import mx.controls.DateChooser;
-
-
- public class myDateChooser extends DateChooser
- {
- public var times:myTimesChoose;
-
- public function myDateChooser()
- {
- super();
-
- this.width=195;
- this.height=195;
- this.setStyle("fontSize", "12");
- times=new myTimesChoose();
- times.x=0;
- times.y=this.height;
- }
-
- protected override function createChildren():void
- {
- super.createChildren();
- addChild(times);
- }
- }
- }
<textarea class="java" style="DISPLAY: none" name="code" readonly="readonly">package nmsDateField { import mx.controls.DateChooser; //重写DateChooser,添加了时分秒的选择 public class myDateChooser extends DateChooser { public var times:myTimesChoose; public function myDateChooser() { super(); this.width=195; this.height=195; this.setStyle("fontSize", "12"); times=new myTimesChoose(); times.x=0; times.y=this.height; } protected override function createChildren():void { super.createChildren(); addChild(times); } } }</textarea>
myTimesChoose.cs
view plain copy to clipboard print ?
- package nmsDateField
- {
- import flash.events.Event;
-
- import mx.containers.HBox;
- import mx.containers.Panel;
- import mx.controls.ComboBox;
- import mx.controls.Label;
- import mx.formatters.DateFormatter;
-
-
- public class myTimesChoose extends Panel
- {
- public var timesBox:HBox;
-
- public var labMinute:Label;
- public var labSecond:Label;
-
-
- public var nmsHour:ComboBox;
- public var nmsMinute:ComboBox;
- public var nmsSecond:ComboBox;
-
- private var parseDate:Date;
-
-
- private var dataSourceHour:Array=["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23"];
-
-
- private var dataSourceMinuteSecond:Array=["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59"];
-
-
- private var arryBackgroundColor:Array=["white", "white", "white", "white"];
-
- public function myTimesChoose()
- {
- super();
- this.width=195;
- this.height=23;
-
- this.setStyle("headerHeight", 0);
- this.setStyle("borderStyle", "solid");
- this.setStyle("borderThicknessLeft", 1);
- this.setStyle("borderThicknessRight", 1);
- this.setStyle("cornerRadius", 0);
-
- timesBox=new HBox();
- timesBox.setStyle("horizontalGap", "0");
- timesBox.setStyle("verticalGap", "0");
- timesBox.setStyle("verticalAlign", "middle");
- timesBox.setStyle("backgroundColor", "white");
- timesBox.setStyle("paddingLeft", "5");
- timesBox.setStyle("paddingBottom", "2");
- timesBox.setStyle("borderStyle", "none");
- }
-
- protected override function createChildren():void
- {
- super.createChildren();
-
- if (!nmsHour)
- {
- nmsHour=new ComboBox();
- nmsHour.width=55;
- nmsHour.height=18;
- nmsHour.dataProvider=dataSourceHour;
- nmsHour.setStyle("cornerRadius", "0");
- nmsHour.setStyle("fontSize", "10");
- nmsHour.setStyle("fillColors", arryBackgroundColor);
- nmsHour.addEventListener("change", updateValue);
- }
-
- if (!labMinute)
- {
- labMinute=new Label();
- labMinute.width=10;
- labMinute.text=":";
- }
-
- if (!nmsMinute)
- {
- nmsMinute=new ComboBox();
- nmsMinute.width=55;
- nmsMinute.height=18;
- nmsMinute.dataProvider=dataSourceMinuteSecond;
- nmsMinute.setStyle("fontSize", "10");
- nmsMinute.setStyle("cornerRadius", "0");
- nmsMinute.setStyle("fillColors", arryBackgroundColor);
- nmsMinute.addEventListener("change", updateValue);
- }
-
- if (!labSecond)
- {
- labSecond=new Label();
- labSecond.width=10;
- labSecond.text=":";
- }
-
- if (!nmsSecond)
- {
- nmsSecond=new ComboBox();
- nmsSecond.width=55;
- nmsSecond.height=18;
- nmsSecond.setStyle("fontSize", "10");
- nmsSecond.setStyle("cornerRadius", "0");
- nmsSecond.setStyle("fillColors", arryBackgroundColor);
- nmsSecond.dataProvider=dataSourceMinuteSecond;
- nmsSecond.addEventListener("change", updateValue);
- }
-
- timesBox.addChild(nmsHour);
- timesBox.addChild(labMinute);
- timesBox.addChild(nmsMinute);
- timesBox.addChild(labSecond);
- timesBox.addChild(nmsSecond);
-
- this.addChild(timesBox);
- }
-
-
- private function updateValue(event:Event):void
- {
- if (this.parent is myDateChooser)
- {
- var dateChooser:myDateChooser=this.parent as myDateChooser;
-
- if (dateChooser.selectedDate == null)
- {
- parseDate=new Date();
- }
- else
- {
- parseDate=dateChooser.selectedDate;
- }
-
- if (dateChooser.owner is myDateField)
- {
- var dateField:myDateField=dateChooser.owner as myDateField;
- dateField.labelFunction=formatDateTemp;
- }
- }
- }
-
-
- private function formatDateTemp(date:Date):String
- {
- if (date == null)
- {
- date=new Date();
- }
-
- date.hours=(Number)(nmsHour.selectedItem);
- date.minutes=(Number)(nmsMinute.selectedItem);
- date.seconds=(Number)(nmsSecond.selectedItem);
-
- var df:DateFormatter=new DateFormatter();
- df.formatString="YYYY-MM-DD JJ:NN:SS";
-
- var times:String=df.format(date);
-
- return times;
- }
- }
- }
<textarea class="java" style="DISPLAY: none" name="code" readonly="readonly">package nmsDateField { import flash.events.Event; import mx.containers.HBox; import mx.containers.Panel; import mx.controls.ComboBox; import mx.controls.Label; import mx.formatters.DateFormatter; //重写Panel,实现时分秒的选择 public class myTimesChoose extends Panel { public var timesBox:HBox; public var labMinute:Label; public var labSecond:Label; //时分秒下拉框 public var nmsHour:ComboBox; public var nmsMinute:ComboBox; public var nmsSecond:ComboBox; private var parseDate:Date; //小时 private var dataSourceHour:Array=["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23"]; //分钟和秒 private var dataSourceMinuteSecond:Array=["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59"]; //时分秒下拉框的填充色 private var arryBackgroundColor:Array=["white", "white", "white", "white"]; public function myTimesChoose() { super(); this.width=195; this.height=23; this.setStyle("headerHeight", 0); this.setStyle("borderStyle", "solid"); this.setStyle("borderThicknessLeft", 1); this.setStyle("borderThicknessRight", 1); this.setStyle("cornerRadius", 0); timesBox=new HBox(); timesBox.setStyle("horizontalGap", "0"); timesBox.setStyle("verticalGap", "0"); timesBox.setStyle("verticalAlign", "middle"); timesBox.setStyle("backgroundColor", "white"); timesBox.setStyle("paddingLeft", "5"); timesBox.setStyle("paddingBottom", "2"); timesBox.setStyle("borderStyle", "none"); } protected override function createChildren():void { super.createChildren(); if (!nmsHour) { nmsHour=new ComboBox(); nmsHour.width=55; nmsHour.height=18; nmsHour.dataProvider=dataSourceHour; nmsHour.setStyle("cornerRadius", "0"); nmsHour.setStyle("fontSize", "10"); nmsHour.setStyle("fillColors", arryBackgroundColor); nmsHour.addEventListener("change", updateValue); } if (!labMinute) { labMinute=new Label(); labMinute.width=10; labMinute.text=":"; } if (!nmsMinute) { nmsMinute=new ComboBox(); nmsMinute.width=55; nmsMinute.height=18; nmsMinute.dataProvider=dataSourceMinuteSecond; nmsMinute.setStyle("fontSize", "10"); nmsMinute.setStyle("cornerRadius", "0"); nmsMinute.setStyle("fillColors", arryBackgroundColor); nmsMinute.addEventListener("change", updateValue); } if (!labSecond) { labSecond=new Label(); labSecond.width=10; labSecond.text=":"; } if (!nmsSecond) { nmsSecond=new ComboBox(); nmsSecond.width=55; nmsSecond.height=18; nmsSecond.setStyle("fontSize", "10"); nmsSecond.setStyle("cornerRadius", "0"); nmsSecond.setStyle("fillColors", arryBackgroundColor); nmsSecond.dataProvider=dataSourceMinuteSecond; nmsSecond.addEventListener("change", updateValue); } timesBox.addChild(nmsHour); timesBox.addChild(labMinute); timesBox.addChild(nmsMinute); timesBox.addChild(labSecond); timesBox.addChild(nmsSecond); this.addChild(timesBox); } //当下拉时分秒下拉框的值改变的时候,动态修改日期控制的textinput的显示值 private function updateValue(event:Event):void { if (this.parent is myDateChooser) { var dateChooser:myDateChooser=this.parent as myDateChooser; //若没有选择日期则默认为当天 if (dateChooser.selectedDate == null) { parseDate=new Date(); } else { parseDate=dateChooser.selectedDate; } if (dateChooser.owner is myDateField) { var dateField:myDateField=dateChooser.owner as myDateField; dateField.labelFunction=formatDateTemp; } } } //日期显示格式 private function formatDateTemp(date:Date):String { if (date == null) { date=new Date(); } date.hours=(Number)(nmsHour.selectedItem); date.minutes=(Number)(nmsMinute.selectedItem); date.seconds=(Number)(nmsSecond.selectedItem); var df:DateFormatter=new DateFormatter(); df.formatString="YYYY-MM-DD JJ:NN:SS"; var times:String=df.format(date); return times; } } }</textarea>
myDateField.cs
view plain copy to clipboard print ?
- package nmsDateField
- {
- import flash.events.KeyboardEvent;
- import flash.ui.Keyboard;
-
- import mx.controls.DateField;
- import mx.core.ClassFactory;
- import mx.events.CalendarLayoutChangeEvent;
- import mx.formatters.DateFormatter;
-
-
- public class myDateField extends DateField
- {
- public function myDateField()
- {
- super();
- this.formatString="YYYY-MM-DD";
- this.dayNames=["日", "一", "二", "三", "四", "五", "六"];
- this.monthNames=["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"];
- this.dropdownFactory=new ClassFactory(myDateChooser);
- this.labelFunction=formatDate;
- this.editable=false;
- this.addEventListener(CalendarLayoutChangeEvent.CHANGE, showDateChooser);
- this.addEventListener(KeyboardEvent.KEY_DOWN, handelKeyDown);
- }
-
- private function formatDate(currentDate:Date):String
- {
- var dateFormatter:DateFormatter=new DateFormatter();
-
- dateFormatter.formatString="YYYY-MM-DD JJ:NN:SS";
-
- var times:String=dateFormatter.format(currentDate);
- return times;
- }
-
-
- private function showDateChooser(event:CalendarLayoutChangeEvent):void
- {
- this.open();
- }
-
-
- private function handelKeyDown(event:KeyboardEvent):void
- {
- if (event.keyCode == Keyboard.ENTER)
- {
- var tempNmsDateChooser:myDateChooser=this.dropdown as myDateChooser;
- tempNmsDateChooser.times.nmsHour.close();
- tempNmsDateChooser.times.nmsMinute.close();
- tempNmsDateChooser.times.nmsSecond.close();
- }
- }
- }
- }
<textarea class="java" style="DISPLAY: none" name="code" readonly="readonly">package nmsDateField { import flash.events.KeyboardEvent; import flash.ui.Keyboard; import mx.controls.DateField; import mx.core.ClassFactory; import mx.events.CalendarLayoutChangeEvent; import mx.formatters.DateFormatter; //重写DateField,设置默认中文显示,添加了时分秒的选择 public class myDateField extends DateField { public function myDateField() { super(); this.formatString="YYYY-MM-DD"; this.dayNames=["日", "一", "二", "三", "四", "五", "六"]; this.monthNames=["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"]; this.dropdownFactory=new ClassFactory(myDateChooser); this.labelFunction=formatDate; this.editable=false; this.addEventListener(CalendarLayoutChangeEvent.CHANGE, showDateChooser); this.addEventListener(KeyboardEvent.KEY_DOWN, handelKeyDown); } private function formatDate(currentDate:Date):String { var dateFormatter:DateFormatter=new DateFormatter(); //YYYY-MM-DD JJ:NN:SS此中JJ表示格式位0-23。若换成HH则显示格式位0-24. dateFormatter.formatString="YYYY-MM-DD JJ:NN:SS"; var times:String=dateFormatter.format(currentDate); return times; } //当选择日期时,日历选择器在打开(默认选择日期后就回关闭) private function showDateChooser(event:CalendarLayoutChangeEvent):void { this.open(); } //此处处理在时分秒下拉框出现时,按下回车键,下拉框不会收回去的bug private function handelKeyDown(event:KeyboardEvent):void { if (event.keyCode == Keyboard.ENTER) { var tempNmsDateChooser:myDateChooser=this.dropdown as myDateChooser; tempNmsDateChooser.times.nmsHour.close(); tempNmsDateChooser.times.nmsMinute.close(); tempNmsDateChooser.times.nmsSecond.close(); } } } }</textarea>
nmsDateField.mxml
view plain copy to clipboard print ?
- <?xml version="1.0" encoding="utf-8"?>
- <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:nmsDateField="nmsDateField.*">
- <mx:Style>
- DateChooser{
- cornerRadius: 0;
- }
- </mx:Style>
- <nmsDateField:myDateField />
- </mx:Application>
<textarea class="html" style="DISPLAY: none" name="code" readonly="readonly"><?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:nmsDateField="nmsDateField.*"> <mx:Style> DateChooser{ cornerRadius: 0; } </mx:Style> <nmsDateField:myDateField /> </mx:Application> </textarea>
OK,结束了。几乎没有任何bug。(有一个。。)
源码下载链接;
http://download.csdn.net/detail/lee_541/3733099