仿DateField的时间组件

阅读更多


       xmlns:s="library://ns.adobe.com/flex/spark"
       xmlns:mx="library://ns.adobe.com/flex/mx"
       width="{timeWidth}" height="{timeHeight}" borderColor="#DEDEDE"
       borderVisible="true"
       creationComplete="bordercontainer1_creationCompleteHandler(event)">
 
  
 

 
     import com.easymap.publicWidget.toolWidget.assets.script.CreateTimeImgScript;
   
   import mx.controls.DateChooser;
   import mx.core.FlexGlobals;
   import mx.events.CalendarLayoutChangeEvent;
   import mx.events.FlexEvent;
   import mx.formatters.DateFormatter;
   import mx.managers.PopUpManager;
   
   public var df:DateFormatter = new DateFormatter();
   public var  dc:DateChooser; //时间戳
   public var isPopExist:Boolean = false; //是否有时间控件弹出
   public var isCurrent:Boolean = false; //点击的是否为时间控件
   
   [Bindable]
   public var text:String = ""; //控件文本
   
   [Bindable]
   public var timeWidth:Number = 0; //控件宽
   
   [Bindable]
   public var timeHeight:Number = 0; //控件高
   
   /**
    * 点击日历小图标
    * */
   protected function timestampImg_clickHandler(event:MouseEvent):void
   {
    if (isPopExist) {
     PopUpManager.removePopUp(dc);
     isPopExist = false;
     isCurrent = false;
    } else {
     isPopExist = true;
     isCurrent = true;
     dc = new DateChooser();
     dc.yearNavigationEnabled = true;
     dc.addEventListener(CalendarLayoutChangeEvent.CHANGE, onChange);
     PopUpManager.addPopUp(dc, this.timestampImg, false);
     PopUpManager.centerPopUp(dc);
    }
   }
   
   /**
    * 选择时间事件
    * */
   private function onChange(event:CalendarLayoutChangeEvent):void
   {
    var dt:Date = new Date();
    //df.formatString="YYYY-MM-DD JJ:NN:SS";
    df.formatString="YYYY-MM-DD";
    var stmp:String = df.format(event.newDate);
    stmp = stmp.substr(0, 11) + df.format(dt).substr(10);
    this.textInput.text = stmp;
    this.text = stmp;
    PopUpManager.removePopUp(dc);
    isPopExist = false;
    isCurrent = false;
   }
   
   /**
    * 改变日历图标
    * */
   protected function timestampImg_mouseOverHandler(event:MouseEvent):void
   {
    timestampImg.source = CreateTimeImgScript.QUERY_RILI_OVER;
   }
   
   /**
    * 改变日历图标
    * */
   protected function timestampImg_mouseOutHandler(event:MouseEvent):void
   {
    timestampImg.source = CreateTimeImgScript.QUERY_RILI_UP;
   }
   
   /**
    * 点击文本框
    * */
   protected function textInput_clickHandler(event:MouseEvent):void
   {
    textInput.text = ""; //清楚文本框内容
    this.text = ""; //清楚文本框内容
    if (isPopExist) {
     PopUpManager.removePopUp(dc);
     isPopExist = false;
     isCurrent = false;
    } else {
     isPopExist = true;
     isCurrent = true;
     dc = new DateChooser();
     dc.yearNavigationEnabled = true;
     dc.addEventListener(CalendarLayoutChangeEvent.CHANGE, onChange);
     PopUpManager.addPopUp(dc, this.timestampImg, false);
     PopUpManager.centerPopUp(dc);
    }
   }
   
   /**
    *  派发鼠标点击监听事件
    * */
   protected function bordercontainer1_creationCompleteHandler(event:FlexEvent):void
   {
    Sprite(FlexGlobals.topLevelApplication).addEventListener(MouseEvent.CLICK, hideDateTime);
   }
   
   /**
    * 控制点击时间组件之外的舞台时,隐藏时间控件
    * */
   private function hideDateTime(event:Event):void
   {
    if (!isCurrent) {
     if (isPopExist) {
      isPopExist = false;
      PopUpManager.removePopUp(dc);
     }
    }
    isCurrent = false;
   }
  ]]>
 

         backgroundAlpha="0.0" borderColor="#DEDEDE" borderVisible="false"
        verticalCenter="0">
       mouseOut="timestampImg_mouseOutHandler(event)"
     mouseOver="timestampImg_mouseOverHandler(event)"
     source="{CreateTimeImgScript.QUERY_RILI_UP}"/>
        borderVisible="false" click="textInput_clickHandler(event)" enabled="true"
      focusColor="#FFFFFF" paddingBottom="0" paddingTop="0" text="{text}"/>
 

  • 仿DateField的时间组件_第1张图片
  • 大小: 564 Bytes
  • 仿DateField的时间组件_第2张图片
  • 大小: 7.7 KB
  • timeWidget.rar (4.2 KB)
  • 下载次数: 2
  • 查看图片附件

你可能感兴趣的:(Flex,DateField,时间组件)