`

Flex学习记录(使用Calendar控件-日历样式控件)

阅读更多
Flex 框架提供了两个控件用来实现日历样式的功能:DateField 和DateChooser 控件。DateField
控件提供了一个TextInput 控件和一个点击可以打开日历的日历图标。DateChooser,则不同,
它提供了一个可视的日历给用户操作。下列范例是一个简单的旅程计算器用来展示两种类
型的控件。用户使用DateField 选择开始日期,使用DateChooser 选择结束日期。程序会在
控件的change 事件触发update 事件处理函数中计算旅途持续时间。两个控件的selectedDate
属性会返回用户选择的Date 对象。
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical">
<mx:Form>
	<mx:FormHeading label="Trip Calculator"/>
	<mx:FormItem label="Start Date">
		<mx:DateField id="startDate" change="update(event)"/>
	</mx:FormItem>
	<mx:FormItem label="End Date">
		<mx:DateChooser id="endDate" change="update(event)"/>
	</mx:FormItem>
	<mx:FormItem label="Trip Duration (days)">
		<mx:Label id="display"/>
	</mx:FormItem>
</mx:Form>
<mx:Script>
	<![CDATA[
		import mx.events.CalendarLayoutChangeEvent;
		private static const MILLISECONDS:int = 1000;
		private static const SECONDS:int = 60;
		private static const MINUTES:int = 60;
		private static const HOURS:int = 24;
		private function
		update(evt:CalendarLayoutChangeEvent):void {
			try {
			var diff:Number = endDate.selectedDate.getTime()
			-startDate.selectedDate.getTime();
			// 把毫秒转换成天数
			var days:int =
			int(diff/(MILLISECONDS*SECONDS*MINUTES*HOURS));
			display.text = days.toString();
			}
			catch(ex:Error) {
			}
		}
	]]>
</mx:Script>
</mx:Application>

在日期运算中,使用Date 对象的getTime 方法是非常重要的,以便正确处理闰年。getTime
方法返回从1970 年1 月1 日起流逝的毫秒数。
分享到:
评论

相关推荐

    flex带时分秒日历---完善版

    5. **样式和皮肤**:为了提供良好的用户体验,日历组件可能使用自定义的样式和皮肤。Flex允许开发者通过CSS或主题来改变组件的外观,使其适应不同的设计风格。 6. **用户交互**:日历组件需要考虑用户友好性,比如...

    flex3读书笔记----flex整合hibernate

    综上所述,本文档主要涵盖了Flex 3与Hibernate的集成过程,涉及到了开发环境的搭建,包括FlexBuilder 3、MyEclipse、Tomcat、MySQL和BlazeDS的配置与使用,以及Hibernate的实体类、映射文件和配置文件的创建,为开发...

    wx_calendar-master_日历_

    1、使用Flex布局中设定日历,要求左右2侧各位10rpx,中间组件为80rpx,其余空间均分;2、学习小程序容器和组件,在日历的月份上显示对应日历的特殊日期的弹窗;

    跟我StepByStep学FLEX教程------王一松.pdf

    - **样式和主题**:学习如何使用样式表来统一应用程序的外观,并创建自定义主题以满足特定的设计需求。 - **样式属性**:如颜色、字体等。 - **主题文件**:`.theme`文件用于定义一组样式规则。 #### 六、测试与...

    Flex 自定义 时间 日历 控件

    Flex 自定义 时间 日历 控件

    跟我StepByStep学FLEX教程------王一松

    ### FLEX教程知识点详解 #### 1. FLEX概述 - **FLEX介绍**:FLEX是一种用于构建跨平台富互联网...通过以上知识点的学习,读者可以全面地掌握Flex及其相关技术栈的使用方法,从而能够开发出高质量的富互联网应用程序。

    Flex4视频教程_03-04Alert控件的使用.rar

    Flex4是Adobe Flex框架的第四代版本,它主要基于ActionScript 3.0,用于构建富互联网应用程序(RIA)。在Flex4中,开发者可以利用强大...学习和理解如何有效地使用Alert,将有助于提升Flex4应用程序的交互性和可用性。

    flex-messaging-core-4.7.3.jar

    flex-messaging-core-4.7.3.jar 最新版,下载了好长时间才下载下来,亲测可用!

    flex布局-flex-layout-master.zip

    Flex布局,全称为“Flexible Box”,也常被称为 Flexbox,是一种在CSS3中引入的布局模式,用于处理复杂的网页布局问题。它旨在提供一种更加灵活、动态...在学习和使用Flex布局时,理解这些基本概念和属性是至关重要的。

    flex------组件-----数据可视化

    例如,使用Flex,你可以创建条形图、折线图、饼图、散点图等多种类型的图表。 1. **Charts组件**:Flex的Charts组件是数据可视化的核心。它支持多种图表类型,如LineChart(折线图)用于显示连续数据的变化趋势,...

    FLEX入门实例--------各种Effect的综合运用

    标题 "FLEX入门实例--------各种Effect的综合运用" 指的是一个介绍Adobe Flex中Effect使用的教程。Flex是一个开源框架,用于构建富互联网应用程序(RIA),它基于ActionScript和MXML语言。本教程可能着重于如何在...

    Flex 工程源码--EmployeeMgmt-Flex.7z

    这个压缩包"Flex 工程源码--EmployeeMgmt-Flex.7z"包含了名为"EmployeeMgmt-Flex"的Flex项目源代码,很可能是用于员工管理的系统。下面我们将详细探讨Flex的相关知识点。 1. **Flex框架**:Flex是一套完整的开发...

    Flex 通过年月控制日历

    本文将详细探讨如何在Flex中通过年月控制日历,包括年月控件、日历控件(包含阴历和阳历)、年月控件与日历控件的级联以及封装日历控件的单击和双击事件处理。 首先,让我们了解年月控件。在Flex中,我们可以创建...

    FLEX资源---------手把手实现WebService服务与通讯

    标题中的"FLEX资源---------手把手实现WebService服务与通讯"表明了本文主要关注的是使用Adobe Flex...通过学习这些内容,开发者可以掌握使用Flex与Web服务通信的核心技能,这对于开发跨平台的交互式应用程序至关重要。

    Flex_Viewer解析-----结构(2).doc

    在 Flex Viewer 中,用户可以通过自定义的模块(Module)来扩展功能,这些模块通常表现为可交互的侧边栏控件,即 Widgets。文档《Flex_Viewer解析-----结构(2).doc》主要探讨了Flex Viewer 中Widgets的结构和实现...

    Flex builder 学习学习 2007-10-08

    10. **文档和教程**:如"Flex Ant脚本模板"和"使用Flex Ant Tasks编译flex工程"这样的资料,是学习如何有效利用Ant构建Flex项目的教程。 综上所述,2007年时的Flex Builder学习涵盖了基础的Flex编程概念、MXML和...

    flex-2.6.4.tar

    flex-2.6.4

    flex带时间的日期控件,直接使用

    4. **学习使用**:根据示例,了解如何在自己的Flex项目中导入和实例化这个控件,以及如何设置属性和监听事件。 5. **自定义**:根据需求,你可以参考示例代码,对控件进行必要的定制,以满足特定的界面设计或功能...

Global site tag (gtag.js) - Google Analytics