Customization in Xamarin Numeric Entry (SfNumericTextBox)

29 Sep 20235 minutes to read

Assign nullable value in SfNumericTextBox

The null values can be set in SfNumericTextBox Value property, by setting AllowNull property value to true.

NOTE

By default, the property value is false.

<syncfusion:SfNumericTextBox AllowNull="true" />
SfNumericTextBox numericTextBox = new SfNumericTextBox();
numericTextBox.AllowNull=true;
this.Content = numericTextBox;

Display nullable value image

Set hint text in SfNumericTextBox

The WaterMark property can be used to provide a hint that helps the user to get started with their input. The watermark text is visible when value is empty or null.

<syncfusion:SfNumericTextBox  AllowNull = "true"  Watermark="Enter value" />
SfNumericTextBox  numericTextBox=new SfNumericTextBox();
numericTextBox.Watermark = "Enter value";
numericTextBox.AllowNull = true;
this.Content=numericTextBox;

Display watermark text image

For customizing the color of SfNumericTextBox WaterMark, please refer to this link.

Parsing the value in SfNumericTextBox

Value of the SfNumericTextBox gets parsed based on ParserMode property. ParsingMode is of type Parsers, which is an enum of Double and Decimal. You have option to display the value in double or decimal.

The following code shows the Double parsing mode, which can be set using the [ParserMode] property.

<syncfusion:SfNumericTextBox Value="123.45" ParserMode="Double" />
SfNumericTextBox numericTextBox=new SfNumericTextBox();
numericTextBox.ParserMode=Parsers.Double;
numericTextBox.Value = 123.45;
this.Content = numericTextBox;

NOTE

The default value for ParserMode is Decimal.

Shows a parser mode behavior

Range support in SfNumericTextBox

Restrict the values within a specific range by setting the Maximum and Minimum property values.

<syncfusion:SfNumericTextBox Maximum="1000" Minimum="50" Value="10"/>
SfNumericTextBox numericTextBox = new SfNumericTextBox();
        numericTextBox.Minimum = 50;
        numericTextBox.Maximum = 1000;
        numericTextBox.Value = 10;
        this.Content = numericTextBox;

NOTE

Default Value of Maximum and Minimum is “null”.

SfNumericTextBox RangeSupport

Set the maximum number of decimal digits in SfNumericTextBox

The maximum number of digits to be displayed after the decimal point can be specified by using the MaximumNumberDecimalDigits property.

NOTE

The [MaximumNumberDecimalDigits property can be provided with positive value only.

<syncfusion:SfNumericTextBox Value="123.459" MaximumNumberDecimalDigits="2" />
SfNumericTextBox numericTextBox=new SfNumericTextBox();
numericTextBox.Value = 123.459;
numericTextBox.MaximumNumberDecimalDigits=2;
this.Content = numericTextBox;

Display the textbox value

Remove default decimal digits in SfNumericTextBox

Based on the MaximumNumberDecimalDigits property, the default number of decimal digits is displayed. By disabling the AllowDefaultDecimalDigits Boolean property, those default digits can be removed from the numeric entry view.

<syncfusion:SfNumericTextBox x:Name="numericTextBox" Value="123" AllowDefaultDecimalDigits="False" MaximumNumberDecimalDigits="2" />
SfNumericTextBox numericTextBox = new SfNumericTextBox();
            numericTextBox.Value = 123;
            numericTextBox.MaximumNumberDecimalDigits = 2;
            numericTextBox.AllowDefaultDecimalDigits = false;
            this.Content = numericTextBox;

Display the textbox value without default decimal digits

Selection support in SfNumericTextBox

The SelectAllOnFocus property specifies whether the text should be selected or not when the control gets focus.

<numeric:SfNumericTextBox SelectAllOnFocus="True" Value="12345"/>
SfNumericTextBox numericTextBox=new SfNumericTextBox();
numericTextBox.Value=12345;
numericTextBox.SelectAllOnFocus = true;
this.Content = numericTextBox;

Display the value with selection mode

See also

How to set the MaximumDecimalDigits in SfNumericTextBox

How to have null values in SfNumericTextBox

How to provide null value to SfNumericTextBox

How to change the SfNumericTextBox style using its visual states

How to define and apply a common style for SfNumericTextBox