DateTimeUpDown

The DateTimeUpDown control allows a user to increment or decrement a DateTime using button spinners, up/down keys, or the mouse wheel.

Usage

To use the DateTimeUpDown control simply create an instance of the control in your XAML file, specify the DateTimeUpDown.Value property, and select a Format by setting the DateTimeUpDown.Format property.

<xctk:DateTimeUpDown Value="{Binding LastUpdated}" Format="FullDateTime" />

Modifying the DateTime Value

To increment or decrement the DateTime value, simply select the DateTime part you wish to modify and then interact with either the mouse wheel, spinner buttons, or updown arrow keys. The following image shows what the different DateTime parts look like when you select them.

datetimeupdown_segments.png

Depending on your DateTimeUpDown.Format, you may or maynot have all DateTime parts available. You can also get the formatted DateTimeUpDown.Value by using the DateTimeUpDown.Text property.

Formats

Format Example
FullDateTime fulldatetime.png
LongDate longdate.png
LongTime longtime.png
MonthDay monthday.png
RFC1123 rfc1123.png
ShortDate shortdate.png
ShortTime shorttime.png
SortableDateTime sortabledatetime.png
UniversalSortableDateTime universalsortabledatetime.png
YearMonth yearmonth.png

Custom Format

If the available formats don't fit you rneeds you can create your own custom format. Simply specfiy the Format property as Custom and then provide a FormatString.

custom.jpg

<extToolkit:DateTimeUpDown Format="Custom" FormatString="hh:mm tt" Value="13:30" />

Properties / Events

Property Description
AllowSpin Gets/Sets the ability to perform increment/decrement operations via the keyboard, button spinners, or mouse wheel. (Inherited from UpDownBase<T>.)
CultureInfo Gets/Sets the current CultureInfo. (Inherited from InputBase.)
DefaultValue Get/Sets the value to use when the Value is null and an increment/decrement operation is performed.
Format Gets a DateTimeFormat value representing the format to be used (e.g., FullDateTime, LongDate, etc.).
FormatString Gets/Sets the display format to use when Format is set to Custom (e.g., "hh:mm tt").
IsReadOnly Gets/Sets a value indicating whether the control is read only. (Inherited from InputBase.)
MouseWheelActiveOnFocus Gets/Sets if the control must have focus in order for the mouse wheel to incement/decrement the value. True by default. (Inherited from UpDownBase<T>.)
ShowButtonSpinner Gets/Sets if the button spinners are visible. (Inherited from UpDownBase<T>.)
Spinner Gets/Sets the spinner to use in the control. (Inherited from UpDownBase<T>.)
Text Gets/Sets the formated string representation of the value. (Inherited from InputBase.)
TextAlignment Gets/Sets the alignment of the value of Text. (Inherited from InputBase.)
TextBox Gets/Sets the TextBox to use in the control. (Inherited from UpDownBase<T>.)
Value Gets/Sets the numeric value. (Inherited from UpDownBase<T>.)
Watermark Gets/Sets the object to use as a watermark if the Value is null. (Inherited from InputBase.)
WatermarkTemplate Gets/Sets the DatTemplate to use for the Watermark. (Inherited from InputBase.)


Event Description
ValueChanged Occurs when the Value changes. (Inherited from UpDownBase<T>.)


Get 50+ awesome WPF controls in the Plus Edition.
---

Last edited May 9, 2013 at 8:48 PM by Kosmatos, version 13

Comments

BoucherS Nov 12, 2013 at 12:04 PM 
Can you create a thread in the discussion tab ? Setting the CultureInfo to those locales and using the DateTimePicker works well in v2.1.

charlzbryan Nov 12, 2013 at 8:02 AM 
Spinner does not seem to work for the following locales:
pt-BR,ru-RU,es-ES,ko-KR,ja-JP,zh-CN

Is this a known issue ? Are these locales not supported ?

BoucherS Oct 21, 2013 at 12:16 PM 
Hello, These bugs should be fixed.
For a demo, you can try the "Click Once App" available on this page : https://wpftoolkit.codeplex.com/
with the "DateTime" sample. The DateTimePicker derives from DateTimeUpDown.

Darrell_Sveistrup Oct 21, 2013 at 12:10 AM 
Just tried the DateTimeUpDown control
Does not seem to work, when you tab off the control it just reset to 'now' value
If you edit the value and move off the control, just reset to 'now' value again
Is there a sample project that can confirm that its working on ?