Number Formatting in Xamarin NumericUpDown (SfNumericUpDown)

29 Sep 20233 minutes to read

The values of the SfNumericUpDown can be configured to display different formats like currency format, percent format etc.

Format string support in SfNumericUpDown

The FormatString property determines the format specifier by which the display text has to be formatted.

NOTE

The control displays the formatted text when the focus is lost. The default Value of FormatString is ā€œnā€.

Display currency notation

c - Displays the value with currency notation.

<numeric:SfNumericUpDown FormatString="c"/>
SfNumericUpDown numericUpDown=new SfNumericUpDown();
numericUpDown.FormatString="c";

Display the value with currency notation

Display percentage notation

p ā€“ Displays the value in percentage.

<numeric:SfNumericUpDown  FormatString="p"/>
SfNumericUpDown numericUpDown=new SfNumericUpDown();
numericUpDown.FormatString="p";

Display the value with percentage notation

Display number notation

n ā€“ Displays the value in number format.

<numeric:SfNumericUpDown  FormatString="n"/>
SfNumericUpDown numericUpDown=new SfNumericUpDown();
numericUpDown.FormatString="n";

NOTE

Instead of using above FormatString types, you can provide any symbol or value as string in FormatString property which will be appended with the value in SfNumericUpDown.

Display the value with number notation

Compute to percentage

When the control is in percentage format, the value can be displayed in two ways as follows

  • Value : Displays the actual value with percentage symbol.

    <numeric:SfNumericUpDown  Value="5" FormatString="p" PercentDisplayMode="Value"/>
    SfNumericUpDown numericUpDown=new SfNumericUpDown();
    numericUpDown.Value = 5;
    numericUpDown.FormatString="p";
    numericUpDown.PercentDisplayMode=PercentDisplayMode.Value;

Display the value with PercentageDisplayMode as Compute

  • Compute : Displays the value computed by 100 with percentage symbol.

    <numeric:SfNumericUpDown Value="5" FormatString="p" PercentDisplayMode="Compute"/>
    SfNumericUpDown numericUpDown=new SfNumericUpDown();
    numericUpDown.Value = "5";
    numericUpDown.FormatString="p";
    numericUpDown.PercentDisplayMode=PercentDisplayMode.Compute;

    NOTE

    The control displays the percent value on lost focus.

Display the value with PercentageDisplayMode as Compute

Set enable group separator

The EnableGroupSeparator property is used to get rid of the comma in the Value of SfNumericUpDown.

<numeric:SfNumericUpDown  Value="12345" EnableGroupSeparator="True"/>
SfNumericUpDown NumericUpDown=new SfNumericUpDown();
NumericUpDown.Value=12345;
NumericUpDown.EnableGroupSeparator = true;
this.Content = NumericUpDown;

Display the SfNumericUpDown control with EnableGroupSeparator

See also

How to provide string formats support in SfNumericUpDown