From cc713d3390e2af06304203b0b4b085cde96f76fc Mon Sep 17 00:00:00 2001 From: Sreemon Premkumar M Date: Tue, 19 Aug 2025 17:40:50 +0530 Subject: [PATCH 1/4] ES-975464 - Resolve the ReadMe file length issue in this sample repository --- README.md | 143 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 143 insertions(+) create mode 100644 README.md diff --git a/README.md b/README.md new file mode 100644 index 0000000..134ec22 --- /dev/null +++ b/README.md @@ -0,0 +1,143 @@ +# How to create a custom column from existing column in wpf and uwp datagrid + +This repositories contains the samples to create custom column from existing columnm in [WPF DataGrid](https://www.syncfusion.com/wpf-controls/datagrid) and [UWP DataGrid](https://www.syncfusion.com/uwp-ui-controls/datagrid). + +You can create your own column by overriding the [predefined column types](https://help.syncfusion.com/wpf/datagrid/column-types#_Overriding_existing_cell) in `SfDataGrid`. For example, the `GridDateTimeColumn` loads the DateTime value by default. If you want to display `DateTimeOffset` value, you can create a new column by overriding the `GridDateTimeColumn` class. + +In the below code snippet, converter created to format the `DateTimeOffSet` value to DateTime by defining `ValueBinding` (edit) and `DisplayBinding` (non-edit). + +``` c# +public class DateTimeOffsetFormatConverter : IValueConverter +{ + private GridDateTimeOffsetColumn cachedColumn; + + public DateTimeOffsetFormatConverter(GridDateTimeOffsetColumn column) + { + cachedColumn = column; + } + + public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) + { + value = ((DateTimeOffset)value).DateTime; + var column = cachedColumn as GridDateTimeColumn; + if (value == null || DBNull.Value == value) + { + if (column.AllowNullValue && column.MaxDateTime != System.DateTime.MaxValue && column.NullText == string.Empty) + return column.MaxDateTime; + + if (column.AllowNullValue && column.NullValue != null) + return column.NullValue; + else if (column.AllowNullValue && column.NullText != string.Empty) + return column.NullText; + + if (column.MaxDateTime != System.DateTime.MaxValue) + return column.MaxDateTime; + } + + DateTime _columnValue; + _columnValue = (DateTime)value; + + if (_columnValue < column.MinDateTime) + _columnValue = column.MinDateTime; + + if (_columnValue > column.MaxDateTime) + _columnValue = column.MaxDateTime; + + return DateTimeFormatString(_columnValue, column); + } + + private string DateTimeFormatString(DateTime columnValue, GridDateTimeColumn column) + { + switch (column.Pattern) + { + case DateTimePattern.ShortDate: + return columnValue.ToString("d", column.DateTimeFormat); + case DateTimePattern.LongDate: + return columnValue.ToString("D", column.DateTimeFormat); + case DateTimePattern.LongTime: + return columnValue.ToString("T", column.DateTimeFormat); + case DateTimePattern.ShortTime: + return columnValue.ToString("t", column.DateTimeFormat); + case DateTimePattern.FullDateTime: + return columnValue.ToString("F", column.DateTimeFormat); + case DateTimePattern.RFC1123: + return columnValue.ToString("R", column.DateTimeFormat); + case DateTimePattern.SortableDateTime: + return columnValue.ToString("s", column.DateTimeFormat); + case DateTimePattern.UniversalSortableDateTime: + return columnValue.ToString("u", column.DateTimeFormat); + case DateTimePattern.YearMonth: + return columnValue.ToString("Y", column.DateTimeFormat); + case DateTimePattern.MonthDay: + return columnValue.ToString("M", column.DateTimeFormat); + case DateTimePattern.CustomPattern: + return columnValue.ToString(column.CustomPattern, column.DateTimeFormat); + default: + return columnValue.ToString("MMMM", column.DateTimeFormat); + } + } + + public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) + { + throw new NotImplementedException(); + } +} + +public class DateTimeOffsetToDateTimeConverter : IValueConverter +{ + public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) + { + if (value == null) + return null; + return ((DateTimeOffset)value).DateTime; + } + + public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) + { + if (value == null) + return null; + return value is DateTimeOffset ? value : new DateTimeOffset((DateTime)value); + } +} +``` + +In the below code snippet, `GridDateTimeOffsetColumn` column created from `GridDateTimeColumn`. + +``` c# +public class GridDateTimeOffsetColumn : GridDateTimeColumn +{ + protected override void SetDisplayBindingConverter() + { + if ((DisplayBinding as Binding).Converter == null) + (DisplayBinding as Binding).Converter = new DateTimeOffsetFormatConverter(this); + + if ((ValueBinding as Binding).Converter == null) + (ValueBinding as Binding).Converter = new DateTimeOffsetToDateTimeConverter(); + } +} +``` + +In the below code snippet, created `GridDateTimeOffsetColumn` added to `SfDataGrid.Columns` collection and specify the Pattern as FullDateTime. Since the ShortDate is the default pattern of `GridDateTimeColumn`. + +### XAML + +``` xml + + + + + +``` + +### C# + +``` c# +this.datagrid1.Columns.Add(new GridDateTimeOffsetColumn() +{ + MappingName = "OrderDate", + Pattern = Syncfusion.Windows.Shared.DateTimePattern.FullDateTime, + UseBindingValue = true +}); +``` \ No newline at end of file From d08162fe769fa731e85c4917ff437ad393c79d5c Mon Sep 17 00:00:00 2001 From: SreemonPremkumarM Date: Thu, 6 Nov 2025 10:03:36 +0530 Subject: [PATCH 2/4] Update README.md --- README.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 134ec22..8c68722 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,8 @@ -# How to create a custom column from existing column in wpf and uwp datagrid +# How to Create a Custom Column from Existing Column in WPF / UWP DataGrid? -This repositories contains the samples to create custom column from existing columnm in [WPF DataGrid](https://www.syncfusion.com/wpf-controls/datagrid) and [UWP DataGrid](https://www.syncfusion.com/uwp-ui-controls/datagrid). +This repositories contains the samples to create custom column from existing columnm in [WPF DataGrid](https://www.syncfusion.com/wpf-controls/datagrid) and [UWP DataGrid](https://www.syncfusion.com/uwp-ui-controls/datagrid) (SfDataGrid). -You can create your own column by overriding the [predefined column types](https://help.syncfusion.com/wpf/datagrid/column-types#_Overriding_existing_cell) in `SfDataGrid`. For example, the `GridDateTimeColumn` loads the DateTime value by default. If you want to display `DateTimeOffset` value, you can create a new column by overriding the `GridDateTimeColumn` class. +You can create your own column by overriding the [predefined column types](https://help.syncfusion.com/wpf/datagrid/column-types#_Overriding_existing_cell) in DataGrid. For example, the **GridDateTimeColumn** loads the DateTime value by default. If you want to display `DateTimeOffset` value, you can create a new column by overriding the `GridDateTimeColumn` class. In the below code snippet, converter created to format the `DateTimeOffSet` value to DateTime by defining `ValueBinding` (edit) and `DisplayBinding` (non-edit). @@ -140,4 +140,4 @@ this.datagrid1.Columns.Add(new GridDateTimeOffsetColumn() Pattern = Syncfusion.Windows.Shared.DateTimePattern.FullDateTime, UseBindingValue = true }); -``` \ No newline at end of file +``` From de65c81a637d154b7c28957495ae68f9c9e5500f Mon Sep 17 00:00:00 2001 From: SreemonPremkumarMuthukrishnan Date: Thu, 6 Nov 2025 10:07:27 +0530 Subject: [PATCH 3/4] ES-975464 - Addressed the concerns --- README.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 8c68722..089eed1 100644 --- a/README.md +++ b/README.md @@ -2,9 +2,9 @@ This repositories contains the samples to create custom column from existing columnm in [WPF DataGrid](https://www.syncfusion.com/wpf-controls/datagrid) and [UWP DataGrid](https://www.syncfusion.com/uwp-ui-controls/datagrid) (SfDataGrid). -You can create your own column by overriding the [predefined column types](https://help.syncfusion.com/wpf/datagrid/column-types#_Overriding_existing_cell) in DataGrid. For example, the **GridDateTimeColumn** loads the DateTime value by default. If you want to display `DateTimeOffset` value, you can create a new column by overriding the `GridDateTimeColumn` class. +You can create your own column by overriding the [predefined column types](https://help.syncfusion.com/wpf/datagrid/column-types#_Overriding_existing_cell) in DataGrid. For example, the **GridDateTimeColumn** loads the **DateTime** value by default. If you want to display **DateTimeOffset** value, you can create a new column by overriding the **GridDateTimeColumn** class. -In the below code snippet, converter created to format the `DateTimeOffSet` value to DateTime by defining `ValueBinding` (edit) and `DisplayBinding` (non-edit). +In the below code snippet, converter created to format the **DateTimeOffSet** value to DateTime by defining **ValueBinding** (edit) and **DisplayBinding** (non-edit). ``` c# public class DateTimeOffsetFormatConverter : IValueConverter @@ -101,7 +101,7 @@ public class DateTimeOffsetToDateTimeConverter : IValueConverter } ``` -In the below code snippet, `GridDateTimeOffsetColumn` column created from `GridDateTimeColumn`. +In the below code snippet, **GridDateTimeOffsetColumn** column created from **GridDateTimeColumn**. ``` c# public class GridDateTimeOffsetColumn : GridDateTimeColumn @@ -117,7 +117,7 @@ public class GridDateTimeOffsetColumn : GridDateTimeColumn } ``` -In the below code snippet, created `GridDateTimeOffsetColumn` added to `SfDataGrid.Columns` collection and specify the Pattern as FullDateTime. Since the ShortDate is the default pattern of `GridDateTimeColumn`. +In the below code snippet, created **GridDateTimeOffsetColumn** added to [SfDataGrid.Columns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfDataGrid.html#Syncfusion_UI_Xaml_Grid_SfDataGrid_Columns) collection and specify the Pattern as FullDateTime. Since the **ShortDate** is the default pattern of **GridDateTimeColumn**. ### XAML @@ -126,7 +126,7 @@ In the below code snippet, created `GridDateTimeOffsetColumn` added to `SfDataGr AutoGenerateColumns="False" ItemsSource="{Binding Orders}"> - + ``` From 89fdafbf79e5939eb3b6480f89594525e5ca31dd Mon Sep 17 00:00:00 2001 From: SreemonPremkumarMuthukrishnan Date: Thu, 6 Nov 2025 10:18:44 +0530 Subject: [PATCH 4/4] ES-975464 - Provided codes for UWP --- README.md | 110 +++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 108 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 089eed1..f206e4f 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,7 @@ You can create your own column by overriding the [predefined column types](https In the below code snippet, converter created to format the **DateTimeOffSet** value to DateTime by defining **ValueBinding** (edit) and **DisplayBinding** (non-edit). +### For WPF: ``` c# public class DateTimeOffsetFormatConverter : IValueConverter { @@ -119,7 +120,7 @@ public class GridDateTimeOffsetColumn : GridDateTimeColumn In the below code snippet, created **GridDateTimeOffsetColumn** added to [SfDataGrid.Columns](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.Grid.SfDataGrid.html#Syncfusion_UI_Xaml_Grid_SfDataGrid_Columns) collection and specify the Pattern as FullDateTime. Since the **ShortDate** is the default pattern of **GridDateTimeColumn**. -### XAML +#### XAML ``` xml ``` -### C# +#### C# ``` c# this.datagrid1.Columns.Add(new GridDateTimeOffsetColumn() @@ -141,3 +142,108 @@ this.datagrid1.Columns.Add(new GridDateTimeOffsetColumn() UseBindingValue = true }); ``` + +### For UWP: + +``` csharp +public class DateTimeOffsetFormatConverter : IValueConverter +{ + private GridDateTimeOffsetColumn cachedColumn; + + public DateTimeOffsetFormatConverter(GridDateTimeOffsetColumn column) + { + cachedColumn = column; + } + + object IValueConverter.Convert(object value, Type targetType, object parameter, string language) + { + value = ((DateTimeOffset)value).DateTime; + var column = cachedColumn as GridDateTimeColumn; + + if (value == null || DBNull.Value == value) + { + if (column.AllowNullValue && column.MaxDate != System.DateTime.MaxValue && column.WaterMark == string.Empty) + return column.MaxDate; + + if (column.AllowNullValue && column.WaterMark != string.Empty) + return column.WaterMark; + + if (column.MaxDate != System.DateTime.MaxValue) + return column.MaxDate; + } + + DateTime _columnValue; + _columnValue = (DateTime)value; + + if (_columnValue < column.MinDate) + _columnValue = column.MinDate; + + if (_columnValue > column.MaxDate) + _columnValue = column.MaxDate; + + return _columnValue.ToString(column.FormatString, CultureInfo.CurrentUICulture); + } + + object IValueConverter.ConvertBack(object value, Type targetType, object parameter, string language) + { + throw new NotImplementedException(); + } +} + +public class DateTimeOffsetToDateTimeConverter : IValueConverter +{ + object IValueConverter.Convert(object value, Type targetType, object parameter, string language) + { + if (value == null) + return null; + return ((DateTimeOffset)value).DateTime; + } + + object IValueConverter.ConvertBack(object value, Type targetType, object parameter, string language) + { + if (value == null) + return null; + return value is DateTimeOffset ? value : new DateTimeOffset((DateTime)value); + } +} +``` + +In the below code snippet, **GridDateTimeOffsetColumn** column created from **GridDateTimeColumn**. + +``` csharp +public class GridDateTimeOffsetColumn:GridDateTimeColumn +{ + protected override void SetDisplayBindingConverter() + { + if ((DisplayBinding as Binding).Converter == null) + (DisplayBinding as Binding).Converter = new DateTimeOffsetFormatConverter(this); + + if ((ValueBinding as Binding).Converter == null) + (ValueBinding as Binding).Converter = new DateTimeOffsetToDateTimeConverter(); + } +} +``` + +In the below code snippet, created **GridDateTimeOffsetColumn** added to **SfDataGrid.Columns** collection and specify the full date-time pattern in **FormatString** as **F**. Since the **ShortDate** is the default pattern of **GridDateTimeColumn**. + +#### XAML + +``` xml + + + + + +``` + +#### C# + +``` csharp +this.dataGrid.Columns.Add(new GridDateTimeOffsetColumn() { HeaderText = "Order Date", MappingName = "OrderDate", FormatString = "F" , AllowInlineEditing = true, UseBindingValue = true }); +``` \ No newline at end of file