Donate

WPF TimePicker Control

Based from these sources:
 a. (http://jobijoy.blogspot.com.au/2007/10/time-picker-user-control.html)
 b. Dipitimaya Patra's datepicker in Datagrid

I came up with a modified custom timepicker control embedded in WPF Datagrid with databinding features. I encountered bugs on migrating the present time picker custom control throughout development in .Visual Studio 2010 and I manage to fix them myself. The errors are specifically found on the keydown events and time updates (increment/decrement of values).

Here are the things that I did to make this work:

1. I added a dependency property to the user control
public DateTime TimeValue  
      {  
        get { return (DateTime)GetValue(TimeProperty); }  
        set { SetValue(TimeProperty, value); }  
      }  
      public static readonly DependencyProperty TimeProperty =  
        DependencyProperty.Register("TimeValue", typeof(DateTime), typeof(TimeControlBinding),  
        new UIPropertyMetadata(DateTime.Now, new PropertyChangedCallback(OnTimeChangedTimeVal)));  
      private static void OnTimeChangedTimeVal(DependencyObject obj, DependencyPropertyChangedEventArgs e)  
      {  
        TimeControlBinding control = obj as CustomDatePickerTimeControlBinding;  
        control.Value = new TimeSpan(control.TimeValue.Hour, control.TimeValue.Minute, control.TimeValue.Second);  
      } 
2. Added a datagrid template column for the time field.
<DataGridTemplateColumn Header="Hired Time" Width="100">   
       <DataGridTemplateColumn.CellTemplate>   
        <DataTemplate>   
         <TextBlock Text="{Binding HiredTime, StringFormat=hh:mm:ss}"/>   
        </DataTemplate>   
       </DataGridTemplateColumn.CellTemplate>   
       <DataGridTemplateColumn.CellEditingTemplate>   
        <DataTemplate>   
         <local:TimeControlBinding TimeValue="{Binding Path=HiredTime, Mode=TwoWay}" />   
        </DataTemplate>   
       </DataGridTemplateColumn.CellEditingTemplate>   
      </DataGridTemplateColumn>   
Here's how the control works:
a. on form load

b. on cell editing (used keydown or keyup to modify the values)
c. on cell leave (after modifying the time values), binding occurs.

Cheers!

Thanks to the original sources for the inputs of this control.. :)

Comments

Donate

Popular Posts From This Blog

WPF CRUD Application Using DataGrid, MVVM Pattern, Entity Framework, And C#.NET

TypeScript Error Or Bug: The term 'tsc' is not recognized as the name of a cmdlet, function, script file, or operable program.

Invalid nested tag div found, expected closing tag input