the singularity of being and nothingness
Sencha Touch 2: Ext.ux.field.TimePicker
Today I wrapped up work on a custom Sencha Touch 2 form field component called TimePicker which, as indicated by its name, allows you to select a custom time via the faux-OS picker dialog.
There are a bunch of other TimePickers out there for Touch, but most are old or just don’t do what I want them to do. So I made my own
If you’re interested in using this, head over to my GitHub repo and pull it into your project. There’s a bunch of config, but it’s all documented in the repo.
If you do end up using it, please let me know what you think. I’d love feedback on usefulness, suggestions for improvements, etc.
| Print article | This entry was posted by existdissolve on January 27, 2013 at 3:50 pm, and is filed under Uncategorized. Follow any responses to this post through RSS 2.0. You can leave a response or trackback from your own site. |

about 3 months ago
Looks really useful. Thanks for sharing this. My wish would support for i18n internationalization. Ideally so I can just drop in a config property that replaces all words with translations from my own JSON file.
about 3 months ago
Hi Tony–
Thanks! The internationalization sounds like a great idea. Do you have an example or two of various configs that you would like to support? I’d be happy to integrate something like that into this.
Thanks!
about 3 weeks ago
Hi ExistDissolve,
Really nice component, thanks for sharing.
I’m not sure if I’ve done something wrong but when a time is shown in the field as e.g.03:00 PM i.e. uses meridiem and is greater or equal to 13:00 when clicking in the field the picker is not defaulting to the correct value i.e. 03:00 PM. Instead it defaults to 01:00 PM.
I think the setValue in Time.js should have -
hour : useMeridiem ? value.getHours()==0 ? 12 : value.getHours()>=13 ? value.getHours() – 12 : value.getHours() : value.getHours(),
instead of just -
hour : useMeridiem && value.getHours()==0 ? 12 : value.getHours(),
This way if using Meridiem and greater 12 it turns it into correct AM/PM time.
Cheers,
Rob.
about 3 weeks ago
Hi Rob–
If you have useMeridiem=true, then you should also set the endHour=12. When using a 24-hour based clock (e.g., 13:00, 15:00), meridiems aren’t applicable.
I will, however, add some debugging messages in there to warn about that.
Thanks!