class DatePicker
package feathers.controls
extends FeathersControl › MeasureSprite › ValidatingSprite
implements IFocusObject, IDateSelector
Displays a calendar month view that allows the selection of a date. The header displays the current month and year name, along with buttons to change the currently displayed month and year. The buttons in the header may be hidden, if desired.
The following example creates a date picker, sets the selected date, and listens for when the selection changes:
var datePicker = new DatePicker();
datePicker.selectedDate = new Date(2020, 1, 6);
datePicker.addEventListener(Event.CHANGE, (event:Event) -> {
var datePicker = cast(event.currentTarget, DatePicker);
trace("DatePicker changed: " + datePicker.selectedDate);
});
this.addChild(datePicker);
Events:
openfl.events.Event.CHANGE | Dispatched when |
---|---|
feathers.events.DatePickerEvent.ITEM_TRIGGER | Dispatched when the user taps or clicks an item renderer in the date picker. The pointer must remain within the bounds of the item renderer on release, or the gesture will be ignored. |
1.0.0
.See also:
Static variables
staticfinalread onlyCHILD_VARIANT_DATE_RENDERER:String = "datePicker_dateRenderer"
The variant used to style the date picker's date renderers in a theme.
To override this default variant, set the
DatePicker.customDateRendererVariant
property.
1.0.0
.See also:
staticfinalread onlyCHILD_VARIANT_DECREMENT_MONTH_BUTTON:String = "datePicker_decrementMonthButton"
The variant used to style the decrement month Button
child component
in a theme.
To override this default variant, set the
DatePicker.customDecrementMonthButtonVariant
property.
1.0.0
.See also:
staticfinalread onlyCHILD_VARIANT_DECREMENT_YEAR_BUTTON:String = "datePicker_decrementYearButton"
The variant used to style the decrement year Button
child component
in a theme.
To override this default variant, set the
DatePicker.customDecrementYearButtonVariant
property.
1.0.0
.See also:
staticfinalread onlyCHILD_VARIANT_INCREMENT_MONTH_BUTTON:String = "datePicker_incrementMonthButton"
The variant used to style the increment month Button
child component
in a theme.
To override this default variant, set the
DatePicker.customIncrementMonthButtonVariant
property.
1.0.0
.See also:
staticfinalread onlyCHILD_VARIANT_INCREMENT_YEAR_BUTTON:String = "datePicker_incrementYearButton"
The variant used to style the increment year Button
child component
in a theme.
To override this default variant, set the
DatePicker.customIncrementYearButtonVariant
property.
1.0.0
.See also:
staticfinalread onlyCHILD_VARIANT_MONTH_TITLE_VIEW:String = "datePicker_monthTitleView"
The variant used to style the current month title child component in a theme.
To override this default variant, set the
DatePicker.customMonthTitleViewVariant
property.
1.0.0
.See also:
staticfinalread onlyCHILD_VARIANT_MUTED_DATE_RENDERER:String = "datePicker_mutedDateRenderer"
The variant used to style the date picker's date renderers in a theme.
To override this default variant, set the
DatePicker.customMutedDateRendererVariant
property.
1.0.0
.See also:
staticfinalread onlyCHILD_VARIANT_WEEKDAY_LABEL:String = "datePicker_weekdayLabel"
The variant used to style the Label
child components that display the
names of weekdays.
To override this default variant, set the
DatePicker.customWeekdayLabelVariant
property.
1.0.0
.See also:
Constructor
Variables
read onlyactualLocaleIDName:String
The locale ID name that is being used, which may be different from the requested locale ID name.
1.0.0
.See also:
backgroundSkin:DisplayObject
The default background skin to display behind the date picker's content.
The following example passes a bitmap for the date picker to use as a background skin:
datePicker.backgroundSkin = new Bitmap(bitmapData);
1.0.0
.See also:
customDateRendererVariant:String
A custom variant to set on all date renderers, instead of
DatePicker.CHILD_VARIANT_DATE_RENDERER
.
The customDateRendererVariant
will be not be used if the result of
dateRendererRecycler.create()
already has a variant set.
1.0.0
.See also:
customDecrementMonthButtonVariant:String
A custom variant to set on the decrement month button sub-component,
instead of DatePicker.CHILD_VARIANT_DECREMENT_MONTH_BUTTON
.
The customDecrementMonthButtonVariant
will be not be used if the
result of decrementMonthButtonFactory
already has a variant set.
1.0.0
.See also:
customDecrementYearButtonVariant:String
A custom variant to set on the decrement year button sub-component,
instead of DatePicker.CHILD_VARIANT_DECREMENT_YEAR_BUTTON
.
The customDecrementYearButtonVariant
will be not be used if the
result of decrementYearButtonFactory
already has a variant set.
1.0.0
.See also:
customIncrementMonthButtonVariant:String
A custom variant to set on the increment month button sub-component,
instead of DatePicker.CHILD_VARIANT_INCREMENT_MONTH_BUTTON
.
The customIncrementMonthButtonVariant
will be not be used if the
result of incrementMonthButtonFactory
already has a variant set.
1.0.0
.See also:
customIncrementYearButtonVariant:String
A custom variant to set on the increment year button sub-component,
instead of DatePicker.CHILD_VARIANT_INCREMENT_YEAR_BUTTON
.
The customIncrementYearButtonVariant
will be not be used if the
result of incrementYearButtonFactory
already has a variant set.
1.0.0
.See also:
customMonthNames:Array<String>
A custom set of month names to use instead of the default.
1.0.0
.customMonthTitleViewVariant:String
A custom variant to set on the month title view sub-component,
instead of DatePicker.CHILD_VARIANT_MONTH_TITLE_VIEW
.
The customMonthTitleViewVariant
will be not be used if the
result of monthTitleViewFactory
already has a variant set.
1.0.0
.See also:
customMutedDateRendererVariant:String
A custom variant to set on all date renderers, instead of
DatePicker.CHILD_VARIANT_MUTED_DATE_RENDERER
.
The customMutedDateRendererVariant
will be not be used if the result
of dateRendererRecycler.create()
already has a variant set.
1.0.0
.See also:
customStartOfWeek:Null<Int>
The index of the day that starts each week. 0
is Sunday and 6
is
Saturday. Set to null
to use the default.
1.0.0
.customWeekdayLabelVariant:String
An optional custom variant to use for the labels that display the names
of weekdays, instead of DatePicker.CHILD_VARIANT_WEEKDAY_LABEL
.
1.0.0
.See also:
customWeekdayNames:Array<String>
A custom set of weekday names to use instead of the default.
1.0.0
.dateRendererRecycler:AbstractDisplayObjectRecycler<Dynamic, DatePickerItemState, DisplayObject>
Manages date renderers used by the date picker.
In the following example, the date picker uses a custom date renderer class:
datePicker.dateRendererRecycler = DisplayObjectRecycler.withClass(CustomDateRenderer);
1.0.0
.decrementMonthButtonFactory:AbstractDisplayObjectFactory<Dynamic, Button>
Creates the decrement month button that is displayed as a sub-component.
The button must be of type feathers.controls.Button
.
In the following example, a custom decrement month button factory is provided:
datePicker.decrementMonthButtonFactory = () ->
{
return new Button();
};
1.0.0
.See also:
decrementYearButtonFactory:AbstractDisplayObjectFactory<Dynamic, Button>
Creates the decrement year button that is displayed as a sub-component.
The button must be of type feathers.controls.Button
.
In the following example, a custom decrement year button factory is provided:
datePicker.decrementYearButtonFactory = () ->
{
return new Button();
};
1.0.0
.See also:
disabledBackgroundSkin:DisplayObject
A background skin to display behind the date picker's content when the date picker is disabled.
The following example gives the date picker a disabled background skin:
datePicker.disabledBackgroundSkin = new Bitmap(bitmapData);
datePicker.enabled = false;
1.0.0
.See also:
displayedFullYear:Int
Along with the displayedMonth
, sets the month that is currently
visible in the calendar. Defaults to the current year.
1.0.0
.See also:
displayedMonth:Int
Along with the displayedFullYear
, sets the month that is currently
visible in the calendar. Defaults to the current month.
Months are indexed starting from 0
. So the index of January is 0
,
and the index of December is 11
.
1.0.0
.See also:
headerGap:Float
The space, in pixels, between items in the date picker's header.
In the following example, the date picker's header gap is set to 20 pixels:
datePicker.headerGap = 20.0;
1.0.0
.incrementMonthButtonFactory:AbstractDisplayObjectFactory<Dynamic, Button>
Creates the increment month button that is displayed as a sub-component.
The button must be of type feathers.controls.Button
.
In the following example, a custom increment month button factory is provided:
datePicker.incrementMonthButtonFactory = () ->
{
return new Button();
};
1.0.0
.See also:
incrementYearButtonFactory:AbstractDisplayObjectFactory<Dynamic, Button>
Creates the increment year button that is displayed as a sub-component.
The button must be of type feathers.controls.Button
.
In the following example, a custom increment year button factory is provided:
datePicker.incrementYearButtonFactory = () ->
{
return new Button();
};
1.0.0
.See also:
monthTitleViewFactory:AbstractDisplayObjectFactory<Dynamic, Label>
Creates the current month view that is displayed as a sub-component.
The view must be of type feathers.controls.Label
.
In the following example, a custom current month view factory is provided:
datePicker.monthTitleViewFactory = () ->
{
return new Label();
};
1.0.0
.monthTitleViewPosition:HorizontalAlign
The horizontal position of the month title view, relative to the increment and decrement buttons.
Note: The HorizontalAlign.JUSTIFY
constant is not supported by this
component.
1.0.0
.See also:
paddingBottom:Float
The minimum space, in pixels, between the date picker's bottom edge and the date picker's content.
In the following example, the date picker's bottom padding is set to 20 pixels:
datePicker.paddingBottom = 20.0;
1.0.0
.paddingLeft:Float
The minimum space, in pixels, between the date picker's left edge and the date picker's content.
In the following example, the date picker's left padding is set to 20 pixels:
datePicker.paddingLeft = 20.0;
1.0.0
.paddingRight:Float
The minimum space, in pixels, between the date picker's right edge and the date picker's content.
In the following example, the date picker's right padding is set to 20 pixels:
datePicker.paddingRight = 20.0;
1.0.0
.paddingTop:Float
The minimum space, in pixels, between the date picker's top edge and the date picker's content.
In the following example, the date picker's top padding is set to 20 pixels:
datePicker.paddingTop = 20.0;
1.0.0
.pointerSelectionEnabled:Bool = true
Indicates if selection is changed with MouseEvent.CLICK
or
TouchEvent.TOUCH_TAP
when the item renderer does not implement the
IToggle
interface. If set to false
, all item renderers must control
their own selection manually (not only ones that implement IToggle
).
The following example disables pointer selection:
datePicker.pointerSelectionEnabled = false;
1.0.0
.requestedLocaleIDName:String
showDatesFromAdjacentMonths:Bool
Determines if the date renderers for dates in the adjacent months are visible or not.
1.0.0
.showMonthButtons:Bool
Determines if the buttons to decrement and increment the month buttons are displayed or hidden.
1.0.0
.showMonthTitleView:Bool
Determines if the name of the month title view is displayed or hidden.
1.0.0
.showYearButtons:Bool
Determines if the buttons to decrement and increment the year buttons are displayed or hidden.
1.0.0
.weekdayLabelFactory:AbstractDisplayObjectFactory<Dynamic, Label>
Creates the weekday labels that are displayed as sub-components.
The labels must be of type feathers.controls.Label
.
In the following example, a custom weekday label factory is provided:
datePicker.weekdayLabelFactory = () ->
{
return new Label();
};
1.0.0
.Methods
setPadding(value:Float):Void
Sets all four padding properties to the same value.
1.0.0
.See also: