Flex3下拉日历中的带有comboBox和clear按钮的自定义dateField组件

Question

我插入了dateField组件。 单击后，将显示日历。 我想在日历中添加2个组合框，其中一个显示小时（0到23），另一个显示分钟（0到59），以便用户可以选择时间和日期，并将其显示在文本中输入为日期和时间。 我想添加的另一件事是清除按钮，以清除日历中的选定日期。

Answer 1

由于DateField本质上是结合了DateChooser的TextInput，为什么不自己做呢？ 还要添加两个ComboBox，使TextInput为editable =“ false” text =“ {dateTime}”，其中dateTime是一个可绑定的字符串变量，它是作为DateChooser和两个ComboBox中的值的并置而创建的。 调用在所有三个输入的change事件上创建dateTime字符串的函数。

最后，添加清除按钮，并使其单击事件调用一个函数，在该函数中，您将DateChooser设置为今天，并将两个组合框设置为默认值，并根据需要更新dateTime字符串（根据需要更新为空白或当前日期/时间）您正在尝试做。）

编辑：正如您很好地询问的那样，当我正在学习ACE考试并且认为这是一个不错的锻炼时，这就是我想出的。 我在名为“ components”的程序包中制作了以下自定义组件，并将其称为“ myCustomDateField.mxml”

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml"
initialize="resetDisplay()">
<mx:DateFormatter id="dateFormat" formatString="DD-MMM-YYYY JJ:NN" />

<mx:Script>
<![CDATA[

[Bindable]
public var dateTime:Date;

     private function updateDisplay():void {
    var userDate:Date = new Date();
    userDate.date = cal.selectedDate.date;
    userDate.month = cal.selectedDate.month;
    userDate.fullYear = cal.selectedDate.fullYear;
    userDate.hours = hour.value;
    userDate.minutes = minute.value;
    dateTime = userDate;
}

private function resetDisplay():void {
    var now:Date = new Date();
    cal.selectedDate = now;
    hour.value = now.hours;
    minute.value = now.minutes;
    dateTime = now;
}

]]>
</mx:Script>

<mx:Label text="Select Date and Time:" />
<mx:TextInput id="display" text="{dateFormat.format(dateTime)}" editable="false" />
<mx:DateChooser id="cal" yearNavigationEnabled="true" change="updateDisplay()" />
<mx:Label text="Hour:" />
<mx:NumericStepper id="hour" minimum="0" maximum="23" change="updateDisplay()" />
<mx:Label text="Minute:" />
<mx:NumericStepper id="minute" minimum="0" maximum="59" change="updateDisplay()" />
<mx:Button label="Clear" click="resetDisplay()" />

</mx:HBox>

在我的应用程序中，我在声明标记中添加了xmlns:cust="components.*" ，并插入了一个<cust:myCustomDateFeild id="myDate" />. 我可以使用{myDate.dateTime}.访问父项中的条目{myDate.dateTime}.

我做了一些设计假设，您可以决定更改它，例如格式化程序，然后用NumericStepper替换了组合框。