`

使用flex制作倒计时

    博客分类:
  • flex
阅读更多

因为09年1月17号我要考雅思,每天都惦记着还有多少天到。于是想做个flex的倒计时来提示自己时间在流逝。

制作第一步是算法。

使用timer控件来做定时器,每秒计算一次。具体算法为

   var minusSecond:int=downDate.getSeconds() - currentDate.getSeconds();
   var minusMinute:int;
   var minusHour:int;
   var minusDate:int;
   var minusMonth:int;
   var minusYear:int;
   
   var sFlag:Boolean;
   var mFlag:Boolean;
   var hFlag:Boolean;
   var monFlag:Boolean;
   
   if(minusSecond<0){
    minusSecond=60+minusSecond;
    sFlag=true;   
   }
   
   minusMinute=downDate.getMinutes() - currentDate.getMinutes();
   if(sFlag)
    minusMinute--;
   
   if(minusMinute<0){
    minusMinute=60+minusMinute;
    mFlag=true;
   }   
   
   minusHour=downDate.getHours() - currentDate.getHours();
   if(mFlag)
    minusHour--;
    
   if(minusHour<0){
    minusHour=24+minusHour;
    hFlag=true;
   }
   
   minusDate =downDate.getDate() - currentDate.getDate();
   minusMonth=downDate.getMonth() - currentDate.getMonth();
   
   if(hFlag){
    minusDate--;
   }
   
   if(minusDate>=0){
    minusMonth;
   }else{
    switch(currentDate.getMonth()+1){
     case 1,3,5,7,8,10,12:{
      minusDate = downDate.getDate() +(31- currentDate.getDate());
     }
     case 4,6,9,11:{
      minusDate = downDate.getDate() +(30- currentDate.getDate());
     }
     case 2:{
      if((currentDate.getFullYear()%4==0&&currentDate.getFullYear()%100!=0)||(currentDate.getFullYear()%400==0)){//闰年
       minusDate = downDate.getDate()+(29 - currentDate.getDate());
      }else{
       minusDate = downDate.getDate() +(28- currentDate.getDate());
      }
     }
    }
    minusMonth--;
   }    
   
   if(minusMonth<0){
    minusMonth=12+minusMonth;
    monFlag=true;
   }
   
   minusYear=downDate.getFullYear() - currentDate.getFullYear();
   if(monFlag){
    minusYear--;
   }

这个算法的优点是1、年月日各自为政。 2、从秒算起,为负数就向上减一,理解起来和书写起来都很方便滴哦。

 

第二步是将算法封装到控件,这里我使用的是<mx:Label>

需要强调的是,label换行是个弊端。但它的htmlText属性可以优化界面。

 

第三步是在应用界面调用封装好的label控件。为了将来计算其他倒计时,我提供了日期选择界面。

 

以下是我的完整源代码 欢迎切磋 erichan1979@gmail.com

 

 

 

分享到:
评论

相关推荐

    flex(flash)倒计时软件

    在本例中,我们讨论的是一个使用Flex制作的倒计时软件,该软件提供了灵活的时间间隔调整功能,并允许用户替换声音文件以适应不同需求。 首先,让我们深入了解Flex的核心组成部分: 1. **ActionScript**:Flex的...

    jQuery网站建设中倒计时代码.rar

    为了实现倒计时功能,开发者通常会使用JavaScript的Date对象来计算当前时间与目标时间之间的差值,然后根据这个差值更新显示的倒计时数值。以下是一个简单的倒计时代码示例: ```javascript $(document).ready...

    连连看 [FLEX版本]

    在连连看中,可能会有各种动画效果,如匹配成功后的爆炸动画、倒计时效果等,这些都是通过ActionScript控制的。 4. **组件库**:Flex SDK提供了大量的预定义组件,如按钮、面板、列表等,开发者可以利用这些组件...

    HTML5+CSS3+JavaScript 网页设计与制作期末综合大作业 G20五个页面(附完整答案和学生用要求及素材)

    对于“峰会介绍页面”的图文混排,可以使用`display: flex`或`grid`布局来实现灵活的图文布局。同时,CSS3的过渡(transition)、动画(animation)和阴影(box-shadow)等效果可以增强用户体验。 再来看JavaScript...

    情人节html代码大全.pdf

    本文将详细介绍如何运用HTML及其结合CSS的技术来制作具有情人节特色的网页,包括但不限于爱心特效、浪漫背景、情人节贺卡及情人节倒计时等功能。 #### 二、爱心特效实现 **代码示例:** ```html &lt;!DOCTYPE html&gt; ...

    基于FPGA的交通灯控制系统的仿真

    交通灯系统通常包括两个路口,每个路口配备红、黄、绿三种颜色的灯,并且要求具有倒计时显示功能。此外,系统还需要具备手动控制模式,以便在必要时由交警进行干预。具体需求如下: - **红绿灯控制**:每个路口包含...

Global site tag (gtag.js) - Google Analytics