User Guide
368 Chapter 6: Components Dictionary
Creating an application with the DateField component
The following procedure explains how to add a DateField component to an application while
authoring. In this example, the DateField component allows a user to pick a date for an airline
reservation system. All dates before today’s date must be disabled. Also, a 15-day range in
December must be disabled to create a holiday black-out period. Also, some flights are not
available on Mondays, so all Mondays must be disabled for those flights.
To create an application with the DateField component:
1.
Double-click the DateField component in the Components panel to add it to the Stage.
2.
In the Property inspector, enter the instance name flightCalendar.
3.
In the Actions panel, enter the following code on Frame 1 of the Timeline to set the range of
selectable dates:
flightCalendar.selectableRange = {rangeStart:new Date(2001, 9, 1),
rangeEnd:new Date(2003, 11, 1)};
This code assigns a value to the selectableRange property in an ActionScript object that
contains two Date objects with the variable names
rangeStart and rangeEnd. This defines an
upper and lower end of a range within which the user can select a date.
4.
In the Actions panel, enter the following code on Frame 1 of the Timeline to set the ranges of
disabled dates, one during December, and one for all dates before the current date:
flightCalendar.disabledRanges = [{rangeStart: new Date(2003, 11, 15),
rangeEnd: new Date(2003, 11, 31)}, {rangeEnd: new Date(2003, 6, 16)}];
5.
In the Actions panel, enter the following code on Frame 1 of the Timeline to disable Mondays:
flightCalendar.disabledDays=[1];
6.
Control > Test Movie.
Customizing the DateField component (Flash Professional only)
You can transform a DateField component horizontally while authoring and at runtime. While
authoring, select the component on the Stage and use the Free Transform tool or any
of the Modify > Transform commands. At runtime, use the
setSize() method (see
UIObject.setSize()). Setting the width does not change the dimensions of the date chooser in
the DateField component. However, you can use the
pullDown property to access the
DateChooser component and set its dimensions.
Using styles with the DateField component
You can set style properties to change the appearance of a date field instance. If the name of a style
property ends in “Color”, it is a color style property and behaves differently than noncolor style
properties. For more information, see “Using styles to customize component color and text”
on page 67.