WynApse Home Page
Home    Blog    About    Contact       
Latest Article:


My Tags:
My Sponsors:






Lifetime Member:

Windows 8.1 TimePickers




Last time I talked about the DatePicker added to Windows 8.1 XAML... this time it's the TimePicker.

This is going to be a much smaller post though because there's only two options with this guy: 12 or 24-hour clock.


The XAML

May as well look at the XAML first rather than try to describe what I'm saying:


<TimePicker x:Name="TimePicker01"
Grid.Row="0"
Grid.Column="0"
ClockIdentifier="12HourClock"
Header="12HourClock"
TimeChanged="TimePicker01_TimeChanged"
Margin="0,0,0,10" />
<TimePicker x:Name="TimePicker02"
Grid.Row="1"
Grid.Column="0"
ClockIdentifier="24HourClock"
Header="24HourClock"
TimeChanged="TimePicker02_TimeChanged"
Margin="0,0,0,10" />
<TextBlock Text="{Binding DisplayText1}"
Grid.Row="0"
Grid.Column="1"
VerticalAlignment="Center"
Margin="5,10,0,0"
FontSize="16" />
<TextBlock Text="{Binding DisplayText2}"
Grid.Row="1"
VerticalAlignment="Center"
Grid.Column="1"
Margin="5,10,0,0"
FontSize="16" />


As with the DatePicker sample, these two are identical except for the header text, the TimeChanged handler, and the important part: the ClockIdentifier. As with the DatePicker, I set the Header to match the value of the ClockIdentifier to tell them apart.... um, well... that's not overly necessary since the 12-hour one has an AM/PM selector :)

I wasn't sure about my scheme for displaying output this time because of the values I got, so I did it as a 2X2 grid with the display to the right of the picker as you can see in the screenshot below:



As you can see, the Time value returned by each of the pickers is in 24-hour format. In retrospect, I guess that makes sense, and is the easiest way to deal with it because you'd probably want to bind the ClockIdentifier to something your user can switch to select 12/24 on her own... and the resultant Time is the same to your code in either case.

Not sure what else I can say about this... a screen shot and some XAML says it all.


Again...some things to remember


This is pretty early beta... so things are going to change. I'm just trying to get ahead of the curve here and play with what we have available.

Next time I'm going to check out the XAML snippets since when I tried to use something today it didn't do what I thought it was going to :)

Here is the project for this post, and...

Stay in the Light!

Copyright © 2006-2017, WynApse