Flex实现自定义日期控件

    由于Flex自带的日期使用起来感觉不爽,所以自己动手写了一个。
    在这话就不多说了下面的控件的效果和实现代码:



<?xml version="1.0" encoding="utf-8"?>
<mx:Form initialize="oninit()" xmlns:mx="http://www.adobe.com/2006/mxml" height="22" paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0" maxHeight="22" minHeight="22" minWidth="120">
 <mx:PopUpButton id="selectdate" width="100%" height="100%"/>
 <mx:Form width="340" height="270" paddingBottom="6" paddingLeft="6" paddingRight="6" paddingTop="6" fontSize="12" id="frmData" backgroundColor="#e3e3e3" backgroundAlpha="1.0" borderStyle="solid" cornerRadius="11" alpha="1.0" borderThickness="4" borderColor="#808080">
  <mx:ApplicationControlBar width="100%" paddingLeft="14" paddingRight="0" fillColors="[#ffffff, #8080c0]" borderColor="#8080c0" themeColor="#8080c0" fillAlphas="[1.0, 1.0]" paddingBottom="2" paddingTop="2">
   <mx:ComboBox change="yearchange()" rowCount="10" width="70" height="24" useHandCursor="true" id="cmdPYears"></mx:ComboBox>
   <mx:ComboBox change="monthchange()" rowCount="10" width="58" id="cmdmonth"></mx:ComboBox>
  </mx:ApplicationControlBar>
  <mx:ControlBar width="100%" paddingBottom="0" paddingLeft="14" paddingRight="0" paddingTop="0">
   <mx:Label text="日" textAlign="center" width="35" height="24" fontWeight="bold"/>
   <mx:Label text="一" textAlign="center" width="35" height="24" fontWeight="bold"/>
   <mx:Label text="二" textAlign="center" width="35" height="24" fontWeight="bold"/>
   <mx:Label text="三" textAlign="center" width="35" height="24" fontWeight="bold"/>
   <mx:Label text="四" textAlign="center" width="35" height="24" fontWeight="bold"/>
   <mx:Label text="五" textAlign="center" width="35" height="24" fontWeight="bold"/>
   <mx:Label text="六" textAlign="center" width="35" height="24" fontWeight="bold"/>
  </mx:ControlBar>
  <mx:Form width="100%" height="180" paddingBottom="0" paddingLeft="0" paddingRight="0" id="frmdates" paddingTop="0">
  </mx:Form>
 </mx:Form>
 <mx:Script>
 <![CDATA[
 //Copyright (c) 2005-2006 JianHan Fan 
 //Mail:henryfan@msn.com
 //All rights reserved.
 //-------------------------------------
  import mx.containers.ControlBar;
  import mx.controls.Button;
  import mx.events.IndexChangedEvent;
  import mx.controls.Alert;
  private var mDateValue:Date =new Date();
  function oninit():void
  {
   
   ViewDate(DateValue);
   __CreateControls();
   var b:Button = new Button();
   removeChild(frmData);
   selectdate.popUp= frmData;
  }
  
  public function set DateValue(value:Date)
  {
   mDateValue = value;
   ViewDate(value);
  }
  public function get DateValue():Date
  {
   return mDateValue;
  }
  private function ViewDate(value:Date):void
  {
   selectdate.label= value.fullYear.toString()+"年"
   +(value.month+1).toString()+"月"+ value.date.toString()+"日";
   
  }
  private function __CreateControls():void
  {
   SetSelectYears(DateValue.fullYear);
   createDate(DateValue);
   
  }
  private function createDate(value:Date):void
  {
   frmdates.removeAllChildren();
   var towmonth:int=0;
   var buttons:Array = new Array();
   var item:Button;
   if((value.fullYear%4==0 && value.fullYear%100 !=0) || value.fullYear%400==0)
   {
    towmonth=29;
   }
   else
   {
    towmonth = 28;
   }
   var monthdays:Array= new Array(
   31,towmonth,31,30,31,30,31,31,30,31,30,31);
   //生成本月第一天
   var nd:Date = new Date(value.fullYear,value.month,1);
   var pmdays:int;//上一个月的日数
   if(nd.month==0)
   {
    pmdays= monthdays[11];
   }
   else
   {
    pmdays = monthdays[(nd.month-1)];
   }
   
   
   for(var i:int=(pmdays-nd.day+1);i<=pmdays;i++)
   {
    item = new Button();
    item.label = i.toString();
    item.setStyle("fillColors",[0x808080, 0x808080]);
    if(nd.month==0)
    {
     item.data =new Date(nd.fullYear-1,11,i);
    }
    else
    {
     item.data = new Date(nd.fullYear,nd.month-1,i);
    }
    buttons.push(item);
    
   }
   for(var i:int=1;i<=monthdays[nd.month];i++)
   {
    item = new Button();
    item.label = i.toString();
    item.data = new Date(nd.fullYear,nd.month,i);
    
    item.visible= true;
    buttons.push(item);
   }
   //生成本月最后一天
   nd = new Date(value.fullYear,value.month,monthdays[nd.month]);
   var nday:int=1;//下一个月的日期
   for(var i:int= nd.day+1;i<7;i++)
   {
    item = new Button();
    item.label = nday.toString();
    item.setStyle("fillColors",[0x808080, 0x808080]);
    if(nd.month==11)
    {
     item.data =new Date(nd.fullYear+1,0,nday);
    }
    else
    {
     item.data =new Date(nd.fullYear,nd.month+1,nday);
    }
    buttons.push(item);
    nday++;
   }
   var panel:ControlBar;
   var row:int=0;
   for(var i:int =0;i< buttons.length;i++)
   {
    buttons[i].width =35;
   
    (buttons[i] as Button).addEventListener("click",onclick);
    if(i==0 || (i+1)%7==1)
    {
     panel = new ControlBar();
     panel.width=new Number("100%");
     panel.setStyle("paddingBottom",1);
     panel.setStyle("paddingLeft",14);
     panel.setStyle("paddingRight",1);
     panel.setStyle("paddingTop",1);
     row++;
     
     panel.label=i.toString();
     frmdates.addChild(panel);
     
    }
    panel.addChild(buttons[i] as DisplayObject)
    
    
   }
   
   
   
   
   
   
  }
  private function onclick(event:Event)
  {
   DateValue= (event.currentTarget.data as Date);
  }
  private function SetSelectYears(year:Number):void
  {
   var nyears:Array = new Array();
   var start:Number = year-50;
   var end:Number = year+50;
   var months:Array = new Array();
   for(var i:Number=start;i<end;i++)
   {
    nyears.push({label:i,data:i});
   }
   for(var k:int=1;k<13;k++)
   {
    months.push({label:k,data:k});
   }
   cmdPYears.dataProvider= nyears;
   cmdPYears.selectedIndex=50;
   cmdmonth.dataProvider= months;
   cmdmonth.selectedIndex = DateValue.month;
  }
  private function yearchange()
  {
   var d:Date = new Date(
   cmdPYears.selectedItem.data,
   cmdmonth.selectedItem.data-1,1);
   createDate(d);
  }
  private function monthchange()
  {
   var d:Date = new Date(
   cmdPYears.selectedItem.data,
   cmdmonth.selectedItem.data-1,1);
      createDate(d);
  }
 ]]>
</mx:Script>

</mx:Form>

 

posted on 2006-08-24 09:55  henry  阅读(8524)  评论(3编辑  收藏  举报

导航