日期计算在很多开发语言中都是一个让人“讨厌”的问题,接下来的例子演示了日期时间相关的一些计算,相信比较符合一些“懒人”的胃口。 :)
让我们先来看一下Demo(可以右键View Source或点击这里察看源代码):
下面是完整实现代码(或点击这里察看):
Download: main.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white"
creationComplete="init()">
<mx:Script>
<![CDATA[
import mx.controls.dataGridClasses.DataGridColumn;
private function init():void {
var zeroDate:Date = new Date(0);
/* fullYear */
arrColl.addItem({label:"+2 years", data:dateAdd("fullYear", 2, zeroDate)});
arrColl.addItem({label:"-2 years", data:dateAdd("fullYear", -2, zeroDate)});
/* month */
arrColl.addItem({label:"+11 months", data:dateAdd("month", 11)});
arrColl.addItem({label:"-11 months", data:dateAdd("month", -11)});
/* date */
arrColl.addItem({label:"+4 date", data:dateAdd("date", 4)});
arrColl.addItem({label:"-4 date", data:dateAdd("date", -4)});
/* hours */
arrColl.addItem({label:"+6 hours", data:dateAdd("hours", 6)});
arrColl.addItem({label:"-6 hours", data:dateAdd("hours", -6)});
/* minutes */
arrColl.addItem({label:"+45 minutes", data:dateAdd("minutes", 45)});
arrColl.addItem({label:"-45 minutes", data:dateAdd("minutes", -45)});
/* seconds */
arrColl.addItem({label:"+900 seconds", data:dateAdd("seconds", 900)});
arrColl.addItem({label:"-900 seconds", data:dateAdd("seconds", -900)});
/* milliseconds */
arrColl.addItem({label:"+720000 milliseconds", data:dateAdd("milliseconds", 720000)});
arrColl.addItem({label:"-720000 milliseconds", data:dateAdd("milliseconds", -720000)});
}
private function dateAdd(datepart:String = "", number:Number = 0, date:Date = null):Date {
if (date == null) {
/* Default to current date. */
date = new Date();
}
var returnDate:Date = new Date(date.time);;
switch (datepart.toLowerCase()) {
case "fullyear":
case "month":
case "date":
case "hours":
case "minutes":
case "seconds":
case "milliseconds":
returnDate[datepart] += number;
break;
default:
/* Unknown date part, do nothing. */
break;
}
return returnDate;
}
private function data_labelFunc(item:Object, column:DataGridColumn):String {
return dateFormatter.format(item[column.dataField]);
}
]]>
</mx:Script>
<mx:ArrayCollection id="arrColl" />
<mx:DateFormatter id="dateFormatter"
formatString="YYYY/MM/DD HH:NN:SS" />
<mx:Label text="Now: {dateAdd()}" />
<mx:DataGrid id="dataGrid"
dataProvider="{arrColl}"
sortableColumns="false"
width="400">
<mx:columns>
<mx:DataGridColumn dataField="label"
headerText="Label"
width="150" />
<mx:DataGridColumn dataField="data"
headerText="YYYY/MM/DD HH:NN:SS"
labelFunction="data_labelFunc" />
</mx:columns>
</mx:DataGrid>
</mx:Application>
代码:Peter deHaan 翻译/整理/编译:minidxer
分享到:
相关推荐
在这个例子中,`formatString`属性设定了日期的格式,"yyyy"代表四位数的年份,"MM"代表两位数的月份,"dd"则代表两位数的日期。 Flex还提供了DateTimeFormat类,它扩展了DateFormatter,提供了更多的日期和时间...
在Flex API 4.0中,管理日期和时间是非常重要的功能之一。这部分内容主要介绍了如何使用`Date`类来处理各种日期和时间的操作。`Date`类提供了丰富的API,可以轻松地获取、设置以及操作日期和时间。 - **创建日期...
在Flex编程中,有时我们需要获取特定日期所在的月份是该年的第几周,这对于日历应用、数据分析或者其他...这个简单的示例展示了在Flex中处理日期和时间的强大能力,使得我们可以方便地进行各种日期相关的计算和操作。
在这个例子中,我们首先获取当前时间,然后计算目标日期与当前日期之间的毫秒差值。接着,我们通过数学运算将这个差值转换成天、小时、分钟和秒。最后,我们用`document.getElementById`获取DOM元素,并更新其内容...
在前端开发中,TimeLine(时间轴)是一种常见的布局方式,用于展示一系列按照时间顺序排列的事件或数据。本文将详细介绍如何使用CSS3构建一个响应式的时间轴效果,并结合Vue框架进行更高级的应用。 首先,让我们...
在这个案例中,我们可以通过JavaScript获取当前时间,然后计算目标日期与当前日期之间的差距,并根据这个差距动态地更新倒计时的数值。 以下是一个基本的JavaScript倒计时逻辑框架: 1. 定义目标日期(例如:广州...
在倒计时应用中,我们可以使用`Date`对象来获取当前时间,并与预设的结束时间进行比较,计算出剩余的时间。例如: ```javascript var endDate = new Date('2023-12-31T23:59:59'); // 设定的结束日期和时间 var ...
在这个例子中,我们创建了一个`id`为`countdown`的`div`,并在其中嵌套了四个`span`元素,分别用于显示天数、小时数、分钟数和秒数。 接下来,CSS(Cascading Style Sheets)用于美化倒计时的样式。在`style.css`中...
2. **数据表组件**:在Shiny应用中,数据表组件如DT或flexdashboard常用于显示和操作大量数据。这些组件支持排序、过滤、分页和自定义列等功能,使得用户可以方便地与数据进行交互。 3. **交互性**:Shiny的一大...
首先计算从当前时间到目标日期的毫秒数,然后转换为天、小时、分钟和秒。 ```javascript const targetDate = new Date('2023-12-31T23:59:59'); const countdownElement = document.getElementById('countdown'); ...