mx:Label text="开始时间" x="56" y="142"/>
<mx:FormItem label="开始时间:" width="42%" x="53" y="87">
<mx:HBox horizontalGap="1">
<mx:DateField id="startDate" editable="false"
selectedDate="{new Date()}"
formatString="YYYY-MM-DD"
dayNames="[日,一,二,三,四,五,六]"
monthNames="[一,二,三,四,五,六,七,八,九,十,十一,十二]"/>
<mx:NumericStepper id="startHour" maxChars="2" maximum="23" width="50" />
<mx:Label text=":" width="18"/>
<mx:NumericStepper id="startMinute" maxChars="2" maximum="59" width="50" />
<mx:Label text=":" width="18"/>
<mx:NumericStepper id="startSecond" maxChars="2" maximum="59" width="50" />
</mx:HBox>
</mx:FormItem>
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml"
horizontalGap="0" verticalAlign="middle">
<mx:NumberValidator id="hourValidator" source="{txtHour}" exceedsMaxError="" lowerThanMinError="" integerError=""
property="text" maxValue="{maxHour}" minValue="{minHour}"
trigger="{txtHour}" triggerEvent="change" invalid="txtHour.text = String(maxHour); txtHour.errorString = '';" />
<mx:NumberValidator id="minuteValidator" source="{txtMinute}" exceedsMaxError="" lowerThanMinError="" integerError=""
property="text" maxValue="59" minValue="0"
trigger="{txtMinute}" triggerEvent="change" invalid="txtMinute.text = '59'" allowNegative="false" />
<mx:NumberValidator id="secondValidator" source="{txtSecond}" exceedsMaxError="" lowerThanMinError="" integerError=""
property="text" maxValue="59" minValue="0"
trigger="{txtSecond}" triggerEvent="change" invalid="txtSecond.text = '59'" allowNegative="false" />
<mx:DateField id="dfDate"/>
<mx:TextInput id="txtHour" height="100%" restrict="0-9" maxChars="2" text="00"
mouseDown="setTextFocus(event)" styleName="textStyle" errorString=""
keyDown="keyHandler(event)"/>
<mx:Spacer width="-8" /><mx:Label text=":" /><mx:Spacer width="-16" />
<mx:TextInput id="txtMinute" height="100%" restrict="0-9" maxChars="2" text="00"
mouseDown="setTextFocus(event)" styleName="textStyle" errorString=""
keyDown="keyHandler(event)"/>
<mx:Spacer width="-8" /><mx:Label text=":" /><mx:Spacer width="-16" />
<mx:TextInput id="txtSecond" height="100%" restrict="0-9" maxChars="2" text="00"
mouseDown="setTextFocus(event)" styleName="textStyle" errorString=""
keyDown="keyHandler(event)"/>
<mx:Style>
.textStyle{
border-thickness : 0;
border-style : none;
background-alpha : 0;
text-align : center;
focus-alpha : 0;
padding-top : 2;
}
</mx:Style>
<mx:Script>
<![CDATA[
[Bindable]
private var maxHour:int = 23;
[Bindable]
private var minHour:int = 0;
private var _is24Hour:Boolean = true;
private function setTextFocus(event:Event):void
{
TextField(event.target).setSelection(0, 2);
}
public function set is24Hour(value:Boolean):void{
this._is24Hour = value;
if(this._is24Hour){
maxHour = 23;
}else{
maxHour = 11;
}
}
//上下箭头按键处理
private function keyHandler(event:KeyboardEvent):void{
var value:int = int(TextInput(event.currentTarget).text);
switch(event.keyCode){
//value++,上、右箭头
case 38:
case 39:
value++;
break;
//value--,下、左箭头
case 37:
case 40:
value--;
break;
}
//小时的设置
if(event.currentTarget == txtHour){
if(value>maxHour){
value = minHour;
}
if(value<0){
value = maxHour;
}
}
//分钟、秒钟的设置
if(event.currentTarget == txtMinute || event.currentTarget == txtSecond){
if(value>59){
value = 0;
}
if(value<0){
value = 59;
}
}
var text:String = String(value);
//不足两位的,前面补0
if(text.length == 1 ){
text = "0"+text;
}
//
TextInput(event.currentTarget).text = text;
// TextInput(event.currentTarget).setSelection(0,2);
}
//设置缺省值
public function set defaultDateTime(date:Date):void{
dfDate.selectedDate = date;
txtHour.text = formatString(date.getHours());
txtMinute.text = formatString(date.getMinutes());
txtSecond.text = formatString(date.getSeconds());
}
private function formatString(value:Number):String{
var str:String = String(value);
if(value<10){
str = "0"+str;
}
return str;
}
//返回当前时间值
public function get value():String{
return dfDate.text+" "+txtHour.text+":"+txtMinute.text+":"+txtSecond.text;
}
]]>
</mx:Script>
</mx:HBox>
分享到:
相关推荐
本项目“flex带时分秒日历---完善版”显然是一个基于Flex技术的日历组件,它不仅显示日期,还支持选择时间,包括小时、分钟和秒钟,这对于需要进行时间选择的Web应用非常实用。 Flex日历组件的设计和实现涉及多个...
### Flex中的时分秒计算详解 #### 一、引言 在Flex开发中,时间相关的功能经常被用到,比如日期选择器、时间输入框等。对于这些需求,Adobe Flex框架提供了丰富的组件来帮助开发者实现。本文将详细介绍如何在Flex...
Flex日期控件的可选时分秒功能大大增强了用户在时间输入上的便捷性,DateTimeField组件为此提供了强大的支持。通过灵活的配置和丰富的交互设计,开发者可以创建出符合各种需求的日期时间输入界面,提升应用的专业性...
因此,“flex DateField 时分秒选择”是一种扩展功能,使得DateField不仅能够处理日期,还能处理精确到秒的时间选择。 这个功能的实现通常涉及对原始Flex DateField的自定义和扩展。开发者可能需要创建一个自定义...
在本篇文章中,我们将深入探讨Flex日期控件(DateTimeField)的使用、配置以及如何实现可选时分秒的功能。 1. **DateTimeField控件的基本使用** Flex中的DateTimeField控件是mx.controls.DateTimeComponent类的...
本主题聚焦于一个名为"FLEX时间带时分秒可直接使用"的功能,该功能解决了在某些场景下,用户选择新的时分秒后日期会自动跳转至当天的问题。下面我们将深入探讨这一功能的具体实现、应用场景以及相关技术。 首先,...
"带时分秒选择"这部分说明了这个自定义控件不仅支持选择日期,还支持选择具体的时间,包括小时、分钟和秒,这在标准的Flex日期选择器中可能并不常见。这样的功能对于需要精确时间管理的应用来说非常实用。 在Flex中...
为了使时间选择精确到时分秒,开发者通常需要设置`formatString`属性,将其值设定为"HH:mm:ss",这样显示的时间格式就会包含24小时制的小时、分钟和秒。例如: ```xml ``` 而`s:DateSpinner`是Spark组件集的一个...
"flex带时分秒控件,项目实现"这个标题所指的就是在Flex项目中创建一个具有时分秒选择功能的日历控件,它扩展了基础的DateField组件。DateField是Adobe Flex中的一个标准组件,用于显示和编辑日期,但默认情况下它只...
6. **集成到项目**:将自定义的DateField组件引入到Flex项目中,替换原有的DateField,这样用户就可以看到一个支持时分秒选择的日期输入控件了。 7. **测试与优化**:进行充分的测试,确保在不同操作系统和浏览器上...
标签"Flex自定义 DateField 选择时分秒 ."进一步确认了这个组件专注于增强日期选择功能,包括时间的选择。压缩包文件"boy_dream_datefield(日期组件)"很可能包含了这个自定义组件的所有源代码和资源,包括...
flex 有时分秒的日期控件,该控件对dateField功能上进行了扩展,可以设置时分秒
在开发移动应用或Web应用时,常常需要用户输入特定的时间信息,这时,年月日时分秒选择器就显得尤为重要。本教程将详细介绍如何利用uniapp的pick组件创建一个这样的选择器,并探讨其灵活性和适用性。 首先,uniapp...
这篇博文“flex通过my97实现时分秒”似乎探讨了如何将My97日期时间控件集成到Flex项目中,以实现对时间的精确选择,包括小时、分钟和秒。 1. Flex基础:Flex是Adobe公司推出的一个开源开发框架,主要用于创建具有...
"Flex 日历控件带时分秒,已经项目实现"这个标题暗示我们讨论的是一个自定义的Flex日历组件,它不仅支持选择日期,还支持选择具体的时间(小时、分钟和秒)。在传统的Flex SDK中,内置的日历控件通常只处理日期,不...
"Flex-时间控件,带年月日时分秒"是一种专门用于处理时间选择的组件,它允许用户方便地设定日期和时间,包括年、月、日、小时、分钟和秒。Flex是一种基于ActionScript 3.0的开源框架,由Adobe开发,主要用于构建富...
本文将深入讲解如何在Flex中获取当前时间、获取当前时间减去一天的时间,并将结果格式化为年月日时分秒的形式。 首先,让我们了解一下在Flex中处理时间的基本概念。在Flex中,我们可以使用内置的Date类来处理日期和...
这些标签的数据绑定可能会与内部的日期对象同步,以确保时间的实时更新。 - 时间选择:可能包含滑块、下拉菜单或按钮,允许用户手动选择时间。例如,`<s:Slider>`可以用于设置分钟和秒数,而`<s:Spinner>`可以用于...
【JS CSS3数字时钟时分秒代码详解】 在网页设计中,动态的时钟效果可以为用户界面增添互动性和实时性。本篇将详细解析如何利用JavaScript(JS)和CSS3来创建一个数字时钟,展示当前的时、分、秒。这个时钟能够自动...
这款软件自带时分秒显示,满足了用户对时间精确到每一刻的需求。 在IT领域,日期处理是一项基础但复杂的工作。日期和时间的计算涉及到闰年、时区转换、日期格式化等多个方面。例如,flex date可能意味着用户可以...