Binding TimeSpan Property in DataGrid (WPF & SL)

If you have a TimeSpan property exposed on your class and if you bind C1DataGrid to the collection of that class objects, the auto-generated TimeSpan column won't be editable. Using a DataGridDateTimeColumn will not fix the issue because the type of objects that DataGridDateTimeColumn expects(DateTime) is a bit different from TimeSpan. This is the one of the few scenarios, though pretty simple, that shows flexibility of C1DataGrid. The easiest way you can handle the issue is by using a simple DataGridTemplateColumn and use a C1TimeEditor as CellEditingTemplate. C1TimeEditor is specifically designedto work with the TimeSpan values. The below xaml code defines the required template:-

<c1:DataGridTemplateColumn Header="Time">  
 <c1:DataGridTemplateColumn.CellTemplate>  
     <DataTemplate>  
           <TextBlock Text="{Binding TimeTaken}"/>  
     </DataTemplate>  
 </c1:DataGridTemplateColumn.CellTemplate>  
 <c1:DataGridTemplateColumn.CellEditingTemplate>  
      <DataTemplate>  
           <c1:C1TimeEditor Format="TimeSpan"  Value="{Binding TimeTaken,Mode=TwoWay}"/>  
      </DataTemplate>  
 </c1:DataGridTemplateColumn.CellEditingTemplate>  
 </c1:DataGridTemplateColumn>

One can also create a custom column inherited from a DataGridBoundColumn. This is useful when adding column at run time or adding columns in AutoGeneratingColumns events.

public class DataGridTimeSpanColumn : DataGridBoundColumn  
 {  
      public DataGridTimeSpanColumn()  
      {  
           Initialize();  
      }  

      public DataGridTimeSpanColumn(PropertyInfo property)  
           : base(property)  
      {  
           Initialize();  
      }  

      protected void Initialize()  
      {  
           IsReadOnly = false;  
      }  

      public override object GetCellContentRecyclingKey(C1.Silverlight.DataGrid.DataGridRow row)  
      {  
           return "TimeEditor";  
      }  

      public override FrameworkElement CreateCellContent(C1.Silverlight.DataGrid.DataGridRow row)  
      {  
           var tb = new TextBlock();  
           return tb;  
      }  

      public override void BindCellContent(FrameworkElement cellContent, C1.Silverlight.DataGrid.DataGridRow row)  
      {  
           var tb = (TextBlock)cellContent;  
           var binding = CopyBinding(Binding);  
           tb.DataContext = row.DataItem;  
           tb.SetBinding(TextBlock.TextProperty, binding);  
      }  

      public override void UnbindCellContent(FrameworkElement cellContent, C1.Silverlight.DataGrid.DataGridRow row)  
      {  
           var timeeditor = (TextBlock)cellContent;  
           timeeditor.DataContext = null;  
      }  

      public override FrameworkElement GetCellEditingContent(C1.Silverlight.DataGrid.DataGridRow row)  
      {  
           var timeeditor = new C1TimeEditor();  
           timeeditor.Format = C1TimeEditorFormat.TimeSpan;  
           var binding = CopyBinding(Binding);  
           timeeditor.SetBinding(C1TimeEditor.ValueProperty, binding);  
           return timeeditor;  
      }  
 }

You can download the attached sample for detailed implementation. Download Sample

GrapeCity

GrapeCity Developer Tools
comments powered by Disqus