I have been fine-combing the web for any guidance, discussions or experience on this and I think I can safely say there’s nothing to be found.
We are developing a set of controls for UWP which we plan to open source and make available for free. One of the controls we are building is a TimeSpanPicker
control, which will essentially look and behave like the TimePicker
control, but instead of being limited to a time of day (i.e. 24 hour interval) it will allow the user to edit an arbitrary TimeSpan
.
From what I have been able to piece together from the visible metadata of the Windows Runtime API, using the built-in TimePicker
control for reference, I am realizing the following types of components are involved:
Control
PickerFlyoutBase
Control
I realize I need to mimic this pattern and write these three components for our picker control, but I can find no information about how these pieces fit together, and from the API surfaces alone I don’t think it’s possible to figure it out.
Specifically, the primary things I’d like to understand are:
TimePickerFlyout
incorporated into the TimePicker
class? I can see no reference to a flyout anywhere within the default template of the picker control.TimePickerFlyoutPresenter
control play, and how is it incorporated into the TimePickerFlyout
class? The TimePickerFlyout
class has no template – so how does it instantiate and communicate with the TimePickerFlyoutPresenter
control?ShouldShowConfirmationButtons
and OnConfirmed
virtual methods on PickerFlyoutBase
? When I override them in my concrete implementation, they are never called.I’d be very thankful for any guidance!
So, since a couple of folks asked me to follow up on this, I was actually eventually able to figure all this stuff out, with some help from Jim Walker (MSFT). It's been a long time coming, but I now decided to revisit this and finally finish those TimeSpanPicker
and TimeSpanEditor
controls I was working on.
https://github.com/IDeliverable/UwpControls
Run the TestHost
project to see both controls in action.
The repository contains a few other controls as well; the part containing the TimeSpanPicker
and TimeSpanEditor
controls is here:
https://github.com/IDeliverable/UwpControls/tree/master/src/IDeliverable.Controls.Uwp.TimeSpanPicker
The code should hopefully serve as a really good sample for anyone interested in how to build a custom picker control, but the controls should also be useful for anyone needing to add TimeSpan
editing functionality to their app. I really went to town with these controls, sweating the details and non-obvious things like accessibility, support for multiple input modes (touch, keyboard, mouse), system theme compliance, full templating support, etc.
Documentation for these two controls is work in progress at the moment.
I plan on packaging these controls up as NuGet packages soon, but for now, you'll have to consume them as source code. I'm also going to check if there's any interest incorporating them into the Window Community Toolkit.