Culture and Formatting in WPF IntegerTextBox

20 May 20213 minutes to read

Value of IntegerTextBox can be formatted in following ways:

  • Culture
  • NumberFormatInfo
  • Dedicated properties (NumberGroupSeparator, NumberGroupSizes)

Culture based formatting

The IntegerTextBox provides support for globalization by using the Culture property. The Culture property is used to format the number group size and group separator of the IntegerTextBox value based on the respective culture.

<syncfusion:IntegerTextBox x:Name="integerTextBox" Height="25" Width="150" Culture="bs-Latn" Value="1234567"/>
IntegerTextBox integerTextBox = new IntegerTextBox();
integerTextBox.Width = 150;
integerTextBox.Height = 25;
integerTextBox.Value = 1234567;

//Setting Latin culture for integer textbox.
integerTextBox.Culture = new System.Globalization.CultureInfo("bs-Latn");

By default the US culture uses “,” as the NumberGroupSeparator where as the Latin culture uses “.” as the NumberGroupSeparator.

Default Culture

WPF IntegerTextBox with Default Culture

Latin Culture

WPF IntegerTextBox with Latin culture

NumberFormatInfo based formatting

The number formatting of IntegerTextBox can be customized by setting NumberFormat property.

<syncfusion:IntegerTextBox x:Name="integerTextBox" Height="25" Width="150" Culture="en-US"
                           Value="123456789012345" GroupSeperatorEnabled="True" >
    <syncfusion:IntegerTextBox.NumberFormat >
        <numberformat:NumberFormatInfo NumberGroupSeparator="/"/>
    </syncfusion:IntegerTextBox.NumberFormat>
</syncfusion:IntegerTextBox>
IntegerTextBox integerTextBox = new IntegerTextBox();
integerTextBox.Width = 150;
integerTextBox.Height = 25;
integerTextBox.GroupSeperatorEnabled = true;
integerTextBox.Value = 123456789012345;
integerTextBox.Culture = new System.Globalization.CultureInfo("en-US");
integerTextBox.NumberFormat = new System.Globalization.NumberFormatInfo() 
{                                   
NumberGroupSeparator = "/"
};

WPF IntegerTextBox with Formatting

The following code illustrate how to set NumberGroupSizes by using the NumberFormatproperty.

IntegerTextBox integerTextBox = new IntegerTextBox();
integerTextBox.Width = 150;
integerTextBox.Height = 25;
integerTextBox.Value = 123456789012345;
integerTextBox.GroupSeperatorEnabled = true;
integerTextBox.NumberFormat = new NumberFormatInfo()
{
    NumberGroupSeparator = "/",
    NumberGroupSizes = new int[] { 2, 3, 4 }
};

WPF IntegerTextBox displays Different Group Size between Numbers

Formatting with dedicated properties

The number formatting of IntegerTextBox can also be customized by setting the NumberGroupSeparator property and the NumberGroupSizes property.
You can show the group separator by enable the GroupSeperatorEnabled property to true.

The following code illustrate how to format using the NumberGroupSeparator, NumberGroupSizes property of the IntegerTextBox.

IntegerTextBox integerTextBox = new IntegerTextBox();
integerTextBox.Width = 150;
integerTextBox.Height = 25;
integerTextBox.Value = 123456789012345;
integerTextBox.NumberGroupSeparator = "/";
integerTextBox.GroupSeperatorEnabled = true;
integerTextBox.NumberGroupSizes = new Int32Collection() { 2, 3, 0 };

WPF IntegerTextBox with Formatting

NOTE

When you use both the NumberFormat and the dedicated properties (NumberGroupSeparator and NumberGroupSizes) to format the value of IntegerTextBox, the NumberGroupSeparatorand NumberGroupSizes properties have higher priority.

NOTE

When you use both NumberFormat and Culture, the NumberFormat will have a higher priority.