您的位置:首页 > 其它

Flex实现自定义日期控件

2006-08-24 09:55 351 查看
由于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>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: