Articles in this section
Category / Section

How to format the GridNumericColumn in the WinRT DataGrid?

5 mins read

In the SfDataGrid, you can display the double type values by using the GridNumericColumn. By default, it loads the TextBlock in the display mode and the DoubleTextBox in the edit mode. You can format the value of the GridNumericColumn by using its inbuilt properties. The following screenshot shows the Annual Income of the GridNumericColumn loaded with its default value without formatting.

Figure 1: Default view of the GridNumericColumn

 

The following XAML code example shows how to format the GridNumericColumn with the built-in properties.

XAML

<Syncfusion:GridNumericColumn   HeaderText="Annual Income"   
                                MappingName="Income" 
                                NumberDecimalDigits="3"
                                NumberDecimalSeparator="." 
                                NumberGroupSizes="3" 
                                NumberGroupSeparator="," />
  • NumerDecimalDigits: NumerDecimalDigits is a dependency property and its type is an Integer. It specifies the number of decimal places to use the numeric value in editor.
  • NumberDecimalSeparator: NumberDecimalSeparator is a dependency property and its default type is string. It separates the integer from the fractional digits.
  • NumberGroupSeparator: NumberGroupSeparator is a dependency property and its default type is string. It separates groups of digits to the left of the decimal in numeric values.
  • NumberGroupSizes: NumberGroupSizes is a dependency property that specifies the Int32Collection or a single digit number. It is used to specify the number of digits in each group to the left of the decimal in numeric values.

The above specified format is applied to the GridNumericColumn as shown in the following screenshot.

Figure 2: After formatting the values in GridNumericColumn

 

In the GridNumericColumn, it is not possible to format the scientific notation since the StringFormat property is applicable only for the GridTextColumn. You can achieve this behavior with the help of the converter in the DisplayBinding property and format the display of the GridNumericColumn.

The following XAML code example shows how to display the scientific notation in the GridNumericColumn by using the converter in the DisplayBinding.

XAML

<Syncfusion:GridNumericColumn HeaderText="Scientific Notation Column" 
                              MappingName="value" 
                              Width="200"
                              DisplayBinding="{Binding value, Converter={StaticResource converter}}"/>

The above converter is invoked for each cell in the GridNumericColumn and the display format can be customized based on the specified format provided in the converter as shown in the following code example.

C#

public class Converter:IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        try
        {
            var formattedString = string.Format("{0:E}", value);               
            return formattedString;
        }
        catch (Exception ex)
        {
        }
        return value;
    }
    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

The above scientific notation format is applied into the GridNumericColumn as shown in the following screenshot.

Figure 3: Scientific Notation in GridNumericColumn

 

You can refer to the sample from the following location.

WPF: GridNumericColumn_WPF.zip

WRT: GridNumericColumn_WRT.zip

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please sign in to leave a comment
Access denied
Access denied