日期条控件 DateFieldControl

日期条控件

书：163

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

               xmlns:s="library://ns.adobe.com/flex/spark"

               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">

    <fx:Script>

        <![CDATA[

            import mx.events.CalendarLayoutChangeEvent;

            protected function displayDate(date:Date):void

            {

                // TODO Auto-generated method stub

                if(date==null) selection.text="所选择日期：";

                else selection.text="所选择的日期："+date.getFullYear().toString()+'/'+(date.getMonth()+1).toString()+'/'+date.getDate();

            }

        ]]>

    </fx:Script>

    <fx:Declarations>

        <!-- 将非可视元素（例如服务、值对象）放在此处 -->

        <s:DateTimeFormatter id="df"/>

    </fx:Declarations>

    <!-- 日期条控件 -->

    <mx:Panel title="日期选择面板控件" height="75%" width="75%" paddingTop="10" paddingLeft="10" paddingRight="10">

        <mx:Label color="blue" fontSize="14" width="100%" text="选择一个日期，选择两次清除当前日期"/>

        <mx:VBox >

            <mx:DateField id="dateChooser1" yearNavigationEnabled="true"

                          formatString="YYYY-MM-DD" width="100"

                          change="displayDate(dateChooser1.selectedDate)"/>

            <mx:Label id="selection" color="blue" text="所选择日期："/>

        </mx:VBox>

    </mx:Panel>

</s:Application>