Skip to content

Commit 2ef2361

Browse files
jcummings2Keboo
authored andcommitted
Fix 960 timepicker with seconds (#968)
* Fix #941 * Add ability to select seconds in TimePicker Add XAML-settable WithSeconds bool to timePicker, which when set allows the user to select seconds Add ToSeconds value to ClockDisplayAutomation enum Add WithSeconds example to Pickers demo * Add ability to cyle through clock to seconds Add CycleWithSeconds example to Pickers demo * On Is24Hour change properly update the TimePicker. * Adding better example of Is 24 hour
1 parent a4c3203 commit 2ef2361

File tree

8 files changed

+1000
-654
lines changed

8 files changed

+1000
-654
lines changed

MainDemo.Wpf/Pickers.xaml

Lines changed: 62 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@
2222
<ColumnDefinition Width="Auto" />
2323
<ColumnDefinition Width="Auto" />
2424
<ColumnDefinition Width="Auto" />
25+
<ColumnDefinition Width="Auto" />
2526
<ColumnDefinition />
2627
</Grid.ColumnDefinitions>
2728
<TextBlock Grid.ColumnSpan="3">Classic WPF DatePicker control with Material Design theme, and new TimePicker control:</TextBlock>
@@ -66,7 +67,7 @@
6667
Style="{StaticResource MaterialDesignFloatingHintTimePicker}"
6768
materialDesign:HintAssist.Hint="Custom hint" />
6869
</smtx:XamlDisplay>
69-
<smtx:XamlDisplay Key="pickers_6_disabled" Grid.Row="2" Grid.Column="1" HorizontalAlignment="Left" Margin="0 16 0 0" VerticalAlignment="Top">
70+
<smtx:XamlDisplay Key="pickers_6_disabled" HorizontalAlignment="Left" Margin="0 16 0 0" VerticalAlignment="Top">
7071
<materialDesign:TimePicker Width="100" IsEnabled="False"
7172
Style="{StaticResource MaterialDesignFloatingHintTimePicker}"
7273
materialDesign:HintAssist.Hint="Disabled" />
@@ -76,22 +77,34 @@
7677
<smtx:XamlDisplay Key="pickers_7" Grid.Row="1" Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="0 16 0 0">
7778
<materialDesign:TimePicker Is24Hours="True" x:Name="PresetTimePicker" Width="100" SelectedTimeChanged="PresetTimePicker_SelectedTimeChanged"/>
7879
</smtx:XamlDisplay>
79-
<smtx:XamlDisplay Key="pickers_8" Grid.Row="1" Grid.Column="3" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="0 16 0 0">
80-
<materialDesign:TimePicker
81-
materialDesign:HintAssist.Hint="Validates"
82-
IsInvalidTextAllowed="True"
83-
Is24Hours="True" Width="100">
84-
<materialDesign:TimePicker.Text>
85-
<Binding Path="ValidatingTime" UpdateSourceTrigger="PropertyChanged">
86-
<Binding.ValidationRules>
87-
<domain:SimpleDateValidationRule ValidatesOnTargetUpdated="True" />
88-
</Binding.ValidationRules>
89-
</Binding>
90-
</materialDesign:TimePicker.Text>
91-
</materialDesign:TimePicker>
80+
<StackPanel Grid.Row="1" Grid.Column="3" VerticalAlignment="Top" HorizontalAlignment="Left">
81+
<smtx:XamlDisplay Key="pickers_8" Margin="0 16 0 0">
82+
<materialDesign:TimePicker
83+
materialDesign:HintAssist.Hint="Validates"
84+
IsInvalidTextAllowed="True"
85+
Is24Hours="{Binding IsChecked, ElementName=Is24HourCheckbox}"
86+
Width="100">
87+
<materialDesign:TimePicker.Text>
88+
<Binding Path="ValidatingTime" UpdateSourceTrigger="PropertyChanged">
89+
<Binding.ValidationRules>
90+
<domain:SimpleDateValidationRule ValidatesOnTargetUpdated="True" />
91+
</Binding.ValidationRules>
92+
</Binding>
93+
</materialDesign:TimePicker.Text>
94+
</materialDesign:TimePicker>
95+
</smtx:XamlDisplay>
96+
<CheckBox Content="Is 24 Hour" x:Name="Is24HourCheckbox" IsChecked="True" Margin="0,10,0,0" VerticalAlignment="Top"/>
97+
</StackPanel>
98+
<smtx:XamlDisplay Key="pickers_11" Grid.Row="1" Grid.Column="4" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="0 16 0 0">
99+
<materialDesign:TimePicker
100+
materialDesign:HintAssist.Hint="With Seconds"
101+
Is24Hours="{Binding IsChecked, ElementName=Is24HourCheckbox}"
102+
x:Name="WithSecondsTimePicker"
103+
WithSeconds="True"
104+
Width="100" />
92105
</smtx:XamlDisplay>
93106

94-
<TextBlock Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="3" Margin="0 128 0 0">By combining the DialogHost (see MainWindow.xaml) and the Calendar and Clock controls, custom popups can be built.</TextBlock>
107+
<TextBlock Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="4" Margin="0 128 0 0">By combining the DialogHost (see MainWindow.xaml) and the Calendar and Clock controls, custom popups can be built.</TextBlock>
95108
<smtx:XamlDisplay Key="pickers_9" Grid.Row="3" Grid.Column="0" Margin="0 32 0 0" HorizontalAlignment="Left">
96109
<StackPanel Orientation="Horizontal">
97110
<TextBlock Text="{Binding Date, StringFormat=d}" VerticalAlignment="Center" FontSize="24" />
@@ -128,7 +141,40 @@
128141
<RowDefinition Height="Auto" />
129142
<RowDefinition Height="Auto" />
130143
</Grid.RowDefinitions>
131-
<materialDesign:Clock DisplayAutomation="Cycle" x:Name="Clock" />
144+
<materialDesign:Clock DisplayAutomation="ToSeconds" x:Name="Clock" />
145+
<StackPanel Grid.Row="1" Margin="8" HorizontalAlignment="Right" Orientation="Horizontal">
146+
<Button Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}" CommandParameter="1" Style="{DynamicResource MaterialDesignFlatButton}">OK</Button>
147+
<Button Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}" CommandParameter="0" Style="{DynamicResource MaterialDesignFlatButton}">CANCEL</Button>
148+
</StackPanel>
149+
</Grid>
150+
</Button.CommandParameter>
151+
</Button>
152+
</StackPanel>
153+
</smtx:XamlDisplay>
154+
<smtx:XamlDisplay Key="pickers_12" Grid.Row="3" Grid.Column="2" Margin="0 32 0 0" HorizontalAlignment="Left">
155+
<StackPanel Orientation="Horizontal">
156+
<TextBlock Text="{Binding Date, StringFormat={}{0:yyyy-MM-dd HH:mm:ss}}" VerticalAlignment="Center" FontSize="24" />
157+
<Button Margin="8 0 0 0" Content="..."
158+
Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}"
159+
materialDesign:DialogHost.DialogOpenedAttached="CombinedDialogOpenedEventHandler"
160+
materialDesign:DialogHost.DialogClosingAttached="CombinedDialogClosingEventHandler">
161+
<Button.CommandParameter>
162+
<Grid Margin="-1">
163+
<Grid.RowDefinitions>
164+
<RowDefinition Height="*" />
165+
<RowDefinition Height="Auto" />
166+
</Grid.RowDefinitions>
167+
<StackPanel Grid.Row="0" Orientation="Horizontal">
168+
<Calendar
169+
x:Name="CombinedCalendar"
170+
Margin="-1 -4 -1 0"
171+
/>
172+
<materialDesign:Clock
173+
x:Name="CombinedClock"
174+
DisplayAutomation="CycleWithSeconds"
175+
Is24Hours="True"
176+
/>
177+
</StackPanel>
132178
<StackPanel Grid.Row="1" Margin="8" HorizontalAlignment="Right" Orientation="Horizontal">
133179
<Button Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}" CommandParameter="1" Style="{DynamicResource MaterialDesignFlatButton}">OK</Button>
134180
<Button Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}" CommandParameter="0" Style="{DynamicResource MaterialDesignFlatButton}">CANCEL</Button>

MainDemo.Wpf/Pickers.xaml.cs

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -83,5 +83,21 @@ private void PresetTimePicker_SelectedTimeChanged(object sender, System.Windows.
8383

8484
Debug.WriteLine($"PresentTimePicker's SelectedTime changed from {oldValue} to {newValue}");
8585
}
86+
87+
public void CombinedDialogOpenedEventHandler(object sender, DialogOpenedEventArgs eventArgs)
88+
{
89+
CombinedCalendar.SelectedDate = ((PickersViewModel)DataContext).Date;
90+
CombinedClock.Time = ((PickersViewModel)DataContext).Time;
91+
}
92+
93+
public void CombinedDialogClosingEventHandler(object sender, DialogClosingEventArgs eventArgs)
94+
{
95+
if (Equals(eventArgs.Parameter, "1"))
96+
{
97+
var combined = CombinedCalendar.SelectedDate.Value.AddSeconds(CombinedClock.Time.TimeOfDay.TotalSeconds);
98+
((PickersViewModel)DataContext).Time = combined;
99+
((PickersViewModel)DataContext).Date = combined;
100+
}
101+
}
86102
}
87103
}

0 commit comments

Comments
 (0)