Click here to Skip to main content
13,453,944 members (42,559 online)
Click here to Skip to main content
Add your own
alternative version


15 bookmarked
Posted 19 Mar 2011

Time Picker

, 19 Mar 2011
Rate this:
Please Sign up or sign in to vote.
A time picker user control that allows the selection of hours, minutes, seconds and crucially milliseconds!!


My code is very simple. It is a user control that does a very similar thing to the standard DateTimePicker however, it is solely a time picker but, unlike DateTimePicker, it allows the user to set milliseconds, not just hours, minutes and seconds.


I am developing a sound player (of sorts) and found the need to have a time picker that could select hours, minutes, seconds and milliseconds but found that the DateTimePicker couldn't do milliseconds. After asking on the CP Q/A forum if any control existed to do what I wanted, I found the answer came back in the negative. So, here is what I have produced to fill my need and hopefully, that of many other people.

Using the Code

The code is very simple using only a text box in the user control. To use it in your application, simply:

  1. Add the TimePicker control to your project.
  2. Rename the TimePickerDemo namespace in the TimePicker.cs and TimePicker.desginer.cs files to your project's namespace.
  3. Add a TimePicker control to a form.
  4. Use the control's OnValueChanged event and Value member to get the time selected by the user. The Value is stored as a TimeSpan.

The control has several useful members; Hours; Minutes; Seconds; Milliseconds and Value which allow you to get and set the time in the time picker. The Value member is a TimeSpan where the Days part is ignored. The code itself is very simple and so I will only demonstrate a small part of it below. The code handles several events in the following ways:

  • LostFocus - The control has lost the focus so the value in it should be what the user wants so format it to make sure.
  • KeyDown - The user has pressed a key. The accepted keys are numeric keys or arrow keys. Left/right arrow keys switch which part of the time is being edited and the up/down arrow keys increment or decrement the part being edited. Parts are hours, minutes, etc.
  • Click - The user has clicked on a part of the control and so has changed the current part being edited. Update the textbox selection accordingly.
  • TextChanged - This is used only to format the text in the text box when the user types an accepted key.

There isn't much to say about the code in this control, it's simple and fairly boring/trivial and warrants only the explanation given. Therefore below I have placed a sample of the FormatText, SetText and SelectCorrectText methods which are the two key methods in this class.

Format Text and Set Text

string[] Parts = TheTimeBox.Text.Trim().Split(":".ToCharArray());

int Hours = 0;
if (!int.TryParse(Parts[0], out Hours))
    Hours = 0;
if (Hours >= 24)
    Hours = 0;

int Minutes = 0;
if (!int.TryParse(Parts[1], out Minutes))
    Minutes = 0;
if (Minutes >= 60)
    Minutes = 0;

string[] SecondParts = Parts[2].Split(".".ToCharArray());

int Seconds = 0;
if (!int.TryParse(SecondParts[0], out Seconds))
    Seconds = 0;
if (Seconds >= 60)
    Seconds = 0;

int Milliseconds = 0;
if (!int.TryParse(SecondParts[1], out Milliseconds))
    Milliseconds = 0;
if (Milliseconds >= 1000)
    Milliseconds = 0;

	Seconds.ToString("D2"), Milliseconds.ToString("D3"));
if (OnValueChanged != null)
    OnValueChanged.Invoke(null, new EventArgs());

Set Text

private void SetText(string Hour, string Minute, string Second, string Millisecond)
      int SelectedIndex = TheTimeBox.SelectionStart;
      TheTimeBox.Text = Hour + ":" + Minute + ":" + Second + "." + Millisecond;
      SelectedIndex = SelectedIndex > TheTimeBox.Text.Length ? 
			TheTimeBox.Text.Length : SelectedIndex;
      if (!DoingFormatting)
      	DoingFormatting = true;
         DoingFormatting = false;

Select Correct Text

private void SelectCorrectText(int SelectedIndex)
      if (SelectedIndex <= 2)
	 TheTimeBox.Select(0, 2);
      else if (SelectedIndex <= 5)
          TheTimeBox.Select(3, 2);
      else if (SelectedIndex <= 8)
          TheTimeBox.Select(6, 2);
          TheTimeBox.Select(9, 3);


  • 19th March, 2011: Initial version


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Ed Nutting
United Kingdom United Kingdom

I am Edward Nutting, born March 1996 and I am currently a Computer Science and Electronic Engineering undergraduate at the University of Bristol, UK. I've been self-teaching programming since I was eight years old and have dabbled in many different areas from web development (where I had my own advertising startup) to low level operating system stuff (my current project Fling OS).

The articles and code on this profile are some of my early work (from when I was aged about 13 to 16) but despite my young age, it has been well received by CodeProject users. My more recent work has been for companies or on projects hosted on GitHub, CodePlex or BitBucket.

I keep an eye on many things techy and am open to any and all ideas, so please feel free to contact me if you think I can help! Smile | :)

Ed Nutting

You may also be interested in...

Comments and Discussions

QuestionLength Of Time in a Web Form Pin
Member 108718378-Jun-14 11:33
memberMember 108718378-Jun-14 11:33 
GeneralTimepicker Pin
Rex_kz18-May-11 0:06
memberRex_kz18-May-11 0:06 
GeneralRe: Timepicker Pin
EdMan19618-May-11 7:58
memberEdMan19618-May-11 7:58 
QuestionScreendump? Pin
Johnny J.21-Mar-11 22:21
memberJohnny J.21-Mar-11 22:21 
QuestionWhy not inherit? Pin
tlhintoq21-Mar-11 13:05
membertlhintoq21-Mar-11 13:05 
AnswerRe: Why not inherit? Pin
EdMan19621-Mar-11 21:13
memberEdMan19621-Mar-11 21:13 
GeneralCould Use An Image Pin
AspDotNetDev19-Mar-11 16:24
mvpAspDotNetDev19-Mar-11 16:24 
GeneralRe: Could Use An Image Pin
EdMan19619-Mar-11 23:17
memberEdMan19619-Mar-11 23:17 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web03-2016 | 2.8.180321.1 | Last Updated 19 Mar 2011
Article Copyright 2011 by Ed Nutting
Everything else Copyright © CodeProject, 1999-2018
Layout: fixed | fluid