How to: Enter numeric values
- 3 minutes to read
The Editors library contains dedicated editors (CalcEdit and SpinEdit) controls) to display and edit numeric values. You can also allow any text editor to accept numeric values.
CalcEdit and SpinEdit Controls
The CalcEdit and SpinEdit editors allow you to edit numeric values in various formats (integer and floating-point values, currency and percentage).
These editors use numeric masks (see editor.Properties.MaskSettings) to restrict user input to valid numbers.
Change the input pattern
Use the Mask Settings dialog to change the input pattern (mask) at design time. You can use one of the following actions to open this dialog:
Click the Change Mask command in the editor’s smart tag menu.
Click the ellipsis button for the MaskSettings property in the Property Grid.
The Mask Settings dialog allows you to specify a mask and customize mask options.
To specify an input mask in code, use the Properties.EditMask or Properties.MaskSettings.MaskExpression property.
// Percentage with 2 decimal places
calcEdit1.Properties.MaskSettings.MaskExpression = "P2";
calcEdit1.Properties.UseMaskAsDisplayFormat = true;
For information on how to specify a mask on the data source layer, see Mask Type: Numeric. This topic also lists the available mask specifiers.
Customize Mask Options
Check the Advanced Settings check box in the Mask Settings dialog to show mask options.
These options include:
- Specify a value assigned to the editor when a user presses Backspace or Delete to clear the editor.
- Specify the output data type.
- Hide the decimal separator for whole numbers.
- Hide insignificant zeros.
- Use the current mask as a display format when the editor is not focused.
- Produce a beep sound when users enter an invalid character.
The Mask Type: Numeric topic describes these options in more detail.
Editor’s Value
Use the following properties to get and set values for standalone editors:
- CalcEdit.Value (a decimal value)
- SpinEdit.Value (a decimal value)
These properties are synchronized with the editor’s EditValue property which is of the object type.
Use the EditValue property for data binding.
Text Editors
To allow a text editor (TextEdit or its descendant) to accept numeric values, do the following:
Select the “Numeric” mask type.
Specify an input mask and mask settings.
Tip
If you do not specify the mask, the editor will use the default mask that accepts decimal numbers.
Do one of the following to specify the editor’s output numeric data type:
- Set the editor’s initial value to a decimal value.
- Bind the editor to a data source field of the decimal type.
Set the Value Type mask setting to Decimal.
Optionally change the text alignment from the editor.Properties.Appearance.TextOptions.HAlignment property.
The following example applies the “P” mask to a text editor:
using DevExpress.XtraEditors.Mask;
var settings = textEdit1.Properties.MaskSettings.Configure<MaskSettings.Numeric>();
settings.MaskExpression = "P";
textEdit1.Properties.MaskSettings.UseMaskAsDisplayFormat = true;
textEdit1.EditValue = 10.3;
textEdit1.Properties.Appearance.TextOptions.HAlignment = DevExpress.Utils.HorzAlignment.Far;
