Flex4.5 自定义的日历控件

效果图：

<?xml version="1.0" encoding="utf-8"?><mx:Form xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="22" minWidth="50" maxHeight="22" chromeColor="#80A8C6" fontFamily="宋体" initialize="oninit()" paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0"><fx:Metadata>[Event(name="mouseclick", type="flash.events.Event")]</fx:Metadata><fx:Script><![CDATA[import ActionScript.AddDataArray;import ActionScript.ToggleLinkButtonSkin;import ActionScript.WindowPoint;import mx.controls.Button;import mx.controls.LinkButton;import mx.events.FlexMouseEvent;import mx.events.ListEvent;import mx.managers.PopUpManager;private var mDateValue:Date = new Date();private var datevalue:Date = new Date();public var showBoolean:Boolean = false;private var linkskin:ToggleLinkButtonSkin;private var newPoint:WindowPoint = new WindowPoint();private var selected:Boolean = false;private var _date:AddDataArray = new AddDataArray();//组件初始化private function oninit():void{ViewDate(DateValue);//_CreateControls();var b:Button = new Button();this.removeChild(frmData);selectedate.addEventListener("click",popup);}public function removepop(e:MouseEvent):void{//关闭日历PopUpManager.removePopUp(frmData);showBoolean = false;}public function Apppopup(event:AppEvent):void{//打开日历PopUpManager.removePopUp(frmData);showBoolean = false;}//functionpublic function popup(event:MouseEvent):void{//打开日历if(!showBoolean){PopUpManager.removePopUp(frmData);//frmData = new Form();PopUpManager.addPopUp(frmData,selectedate,false);PopUpManager.centerPopUp(frmData);newPoint.setDateData(frmData,event);showBoolean = true;}else{showBoolean = false;PopUpManager.removePopUp(frmData);}}//functionpublic function set DateValue(value:Date):void{mDateValue = value;ViewDate(value);}public function get DateValue():Date{return mDateValue;}private function ViewDate(value:Date):void{//日期转年月日格式if(value != null){selectedate.text = ReturnDateformat(value);_CreateControls();}}private function _CreateControls():void{SetSelectYears(DateValue);createDate(DateValue);}private function linkbtnsetStyle(item:LinkButton):void{//设置linkbutton控件的样式item.toggle = true;item.setStyle("paddingRight",0);item.setStyle("paddingLeft",0);item.setStyle("paddingTop",0);item.setStyle("paddingBottom",0);}private function createDate(value:Date):void{frmdates.removeAllChildren();var towmonth:int = 0;var buttons:Array = new Array();var item:LinkButton;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 LinkButton();linkbtnsetStyle(item);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);}item.visible = false;buttons.push(item);}//生成本月天数for(var j:int=1; j<= monthdays[nd.month];j++){item = new LinkButton();linkbtnsetStyle(item);item.setStyle("skin",ActionScript.ToggleLinkButtonSkin);item.label = j.toString();item.data = new Date(nd.fullYear,nd.month,j);//设置当前日期控件的名字,状态if(nd.fullYear == datevalue.fullYear && nd.month == datevalue.month && j == datevalue.date){item.selected = true;item.name = "defaultitem";}if(DateValue.fullYear == nd.fullYear && DateValue.month == nd.month && j == DateValue.date){//保持选择日期的状态item.selected = true;}if(nd.fullYear == datevalue.fullYear && nd.month == datevalue.month && j > datevalue.date){//设置日期的范围,超过则'不允许用户交互'item.enabled = false;}item.visible = true;buttons.push(item);}//生成本月最后一天nd = new Date(value.fullYear,value.month,monthdays[nd.month]); var nday:int =1;//下一个月的日期for(var k:int=nd.day+1; i<7; i++){item = new LinkButton();linkbtnsetStyle(item);item.label = k.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 n:int=0;n<buttons.length; n++){buttons[n].width = 20;buttons[n].height = 16;(buttons[n] as LinkButton).addEventListener("click",onclick);if(n==0 || (n+1)%7 ==1){panel = new ControlBar();panel.width = new Number("100%");panel.setStyle("paddingBottom",0);panel.setStyle("paddingLeft",3);panel.setStyle("paddingRight",0);panel.setStyle("paddingTop",0);row++;panel.label = n.toString();frmdates.addChild(panel);}panel.addChild(buttons[n] as DisplayObject);}}//日期选择事件private function onclick(event:Event):void{Clearlnkbtn(event.target.name);DateValue = (event.currentTarget.data as Date);selected = true;var e:Event = new Event("mouseclick");dispatchEvent(e);removepop(event as MouseEvent);//trace("1231");}private function Clearlnkbtn(name:String):void{//切换选择日期状态var contain:DisplayObjectContainer;var child:DisplayObject;for(var j:int=0; j < frmdates.numChildren; j++){contain = frmdates.getChildAt(j) as DisplayObjectContainer;for(var i:int=0; i < contain.numChildren; i++){child = contain.getChildAt(i);var strName:String = child.name;if(strName != name && strName != "defaultitem"){(child as LinkButton).selected = false; continue;}(child as LinkButton).selected = true;//return; //i--;}}}//初始化'年'与'月'private function SetSelectYears(date:Date):void{var nyears:Array = new Array();var start:Number = datevalue.fullYear - 10;var end:Number   = datevalue.fullYear;var months:Array= new Array();var tomonth:Number;if(date.fullYear < datevalue.fullYear){tomonth = 12;}else{tomonth = datevalue.month + 1; }for(var i:Number = start; i<=end;i++){nyears.push({label:i,data:i});}for(var k:int=1; k <= tomonth; k++){months.push({label:k,data:k});}cmdPYears.dataProvider = nyears;cmdPYears.selectedIndex = 10-(end - date.fullYear);cmdmonth.dataProvider = months;cmdmonth.selectedIndex = date.month;}//设置列表控件日期'月'范围private function selectedYearChange_month(year:Number):void{var months:Array = new Array();var date:Date = new Date();var month:Number = date.getMonth()+1;if(year < date.fullYear){month = 12;}for(var i:int=1; i <= month; i++){months.push({label:i,data:i});}cmdmonth.dataProvider = months;cmdmonth.selectedIndex = DateValue.month;//createDate(date);}protected function yearchange():void{try{var d:Date = new Date(cmdPYears.selectedItem.data,cmdmonth.selectedItem.data-1,1);//createDate(d);selectedYearChange_month(d.fullYear);monthchange();}catch(e:TypeError){trace(e.toString())}}private function monthchange():void{try{var d:Date = new Date(cmdPYears.selectedItem.data,cmdmonth.selectedItem.data-1,1);createDate(d);}catch(e:TypeError){trace(e.toString())}}//左右控件事件protected function linkchange(type:String,_month:int):void{try{var month:int =_month;var thedate:Number = cmdPYears.selectedItem.data;if(type == "up"){month--;}else{month++;}if(thedate == datevalue.fullYear){if(month > cmdmonth.dataProvider.length-1){return;}if(month < 0){thedate-=1;month = 11;}}else if(thedate < datevalue.fullYear){if(month < 0){thedate-=1;month = 11;}if(month > cmdmonth.dataProvider.length-1){thedate+= 1;month = 0;}}var d:Date = new Date(thedate,month,1);//cmdmonth.selectedIndex = month;SetSelectYears(d);createDate(d);}catch(e:IOError){trace(e.toString())}}/**   * 日期格式   * @param value 日期   * @return 返回YYYY-MM-DD格式   */  public function ReturnDateformat(value:Object):String{   var dateformat:DateFormatter = new DateFormatter();   dateformat.formatString = "YYYY-MM-DD";   var nowdate:String = dateformat.format(value);   return nowdate;  }]]></fx:Script><fx:Declarations><!-- 将非可视元素（例如服务、值对象）放在此处 --></fx:Declarations><mx:TextInput id="selectedate" width="100%" height="100%" enabled="true" editable="false"   /><mx:Form width="215" height="195" paddingBottom="6" paddingLeft="6" paddingRight="6" paddingTop="6" fontSize="12" id="frmData" backgroundColor="#ffffff" backgroundAlpha="0.99" borderStyle="solid" cornerRadius="11" alpha="1.0" borderColor="#808080"><mx:Canvas width="100%"><mx:ComboBox change="yearchange()"  mouseFocusEnabled="false" rowCount="10" width="60" useHandCursor="true" id="cmdPYears" horizontalCenter="-27" paddingLeft="1" paddingRight="0" editable="true"/><mx:ComboBox change="monthchange()"  mouseFocusEnabled="false" rowCount="10" width="48" id="cmdmonth"  horizontalCenter="33" editable="true"/><mx:Button click="linkchange('up',cmdmonth.selectedIndex)" left="1" label="<<" width="35" height="20"/><mx:Button click="linkchange('down',cmdmonth.selectedIndex)" right="1" label=">>" width="35" height="20"/></mx:Canvas><mx:ControlBar width="100%" paddingBottom="0" paddingLeft="8" paddingRight="0" paddingTop="0"><mx:Label text="日" textAlign="center" width="20" height="18" fontWeight="bold"/><mx:Label text="一" textAlign="center" width="20" height="18" fontWeight="bold"/><mx:Label text="二" textAlign="center" width="20" height="18" fontWeight="bold"/><mx:Label text="三" textAlign="center" width="20" height="18" fontWeight="bold"/><mx:Label text="四" textAlign="center" width="20" height="18" fontWeight="bold"/><mx:Label text="五" textAlign="center" width="20" height="18" fontWeight="bold"/><mx:Label text="六" textAlign="center" width="20" height="18" fontWeight="bold"/></mx:ControlBar><mx:Form id="frmdates" width="100%" height="100%" paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0"></mx:Form></mx:Form></mx:Form>

下这个是LinkButton的皮肤

package ActionScript{import mx.skins.halo.LinkButtonSkin; public class ToggleLinkButtonSkin  extends LinkButtonSkin {public function ToggleLinkButtonSkin(){super();}/** * 重写LinkButton控件状态 * @param w 宽 * @param h 高 */override protected function updateDisplayList(w:Number, h:Number):void { super.updateDisplayList(w, h); var cornerRadius:Number = getStyle("cornerRadius"); var rollOverColor:uint = getStyle("rollOverColor"); var selectionColor:uint = getStyle("selectionColor"); graphics.clear(); switch (name) { case "upSkin": // Draw invisible shape so we have a hit area. drawRoundRect( 0, 0, w, h, cornerRadius, 0, 0); break; case "selectedUpSkin": case "selectedOverSkin": case "overSkin": drawRoundRect( 0, 0, w, h, cornerRadius, rollOverColor, 1); break; case "selectedDownSkin": case "downSkin": drawRoundRect( 0, 0, w, h, cornerRadius, selectionColor, 1); break; case "selectedDisabledSkin": case "disabledSkin": // Draw invisible shape so we have a hit area. drawRoundRect( 0, 0, w, h, cornerRadius, 0, 0); break; } } }}