So in a previous article I explained why working with time is difficult in Flex (but you probably already know that if you Googled your way here), and we created a helper class to make working with dates and times in Flex easier.
Now we will make a custom input control so time input and validation can be as slick as date entry. To do this we will extend the TextInput class to do the following:
- restrict the input so that it will only accept characters found in time strings
- add a value_commit handler so that it parses the text input after it has been changed
- add a key_down handler so that we can increment and decrement the time when the directional arrows are pressed
- format the time once it has been parsed
- behave properly when used as an itemRenderer or itemEditor
Click on image to launch the Flex application. View source is enabled.