[Yugong Series] Detailed explanation of numericUpDown control on Winform control topic in September 2023

---

foreword

Winform controls are user interface elements in Windows Forms. They can be used to create various visual and interactive components of Windows applications, such as buttons, labels, text boxes, drop-down list boxes, check boxes, radio boxes, progress bars, etc. . Developers can use Winform controls to build user interfaces and respond to user actions to create powerful desktop applications.

1. Detailed explanation of numericUpDown control

The NumericUpDown control is one of the commonly used controls in Winforms, which is used to allow users to select values ​​by adjusting numbers up or down. Here are some common ways to use the NumericUpDown control:

1. Instantiate the control: You can drag and drop the control onto the form or use the following code in the code:

NumericUpDown numericUpDown1 = new NumericUpDown();

2. Set control properties: you can set the minimum value, maximum value, step size and other properties of the control.

numericUpDown1.Minimum = 0;
numericUpDown1.Maximum = 100;
numericUpDown1.Increment = 1;

3. Get and set value: You can get or set the currently selected value through the Value property.

int value = (int)numericUpDown1.Value;
numericUpDown1.Value = 10;

4. Handle the ValueChanged event: A ValueChanged event handler can be added to perform custom actions when the value changes.

private void numericUpDown1_ValueChanged(object sender, EventArgs e)
{
    
    
    //执行操作
}

5. Enable/disable control: The control can be enabled or disabled using the Enabled property.

numericUpDown1.Enabled = false;

The NumericUpDown control is a flexible and easy-to-use control. By understanding its properties and events, it can be easily used to enhance the interactivity and functionality of Winform applications.

1. Attribute introduction

1.1 InterceptArrowKeys

The InterceptArrowKeys property is a Boolean property of the NumericUpDown control. If set to true, you can use the arrow keys to type numeric values ​​instead of just using the up and down arrow buttons. By default, the InterceptArrowKeys property is false and the numeric value can only be changed by using the up and down arrow buttons.

Using the InterceptArrowKeys property can improve the NumericUpDown control experience, allowing users to use a more natural keyboard input method to change numeric values. The following is a code example using the InterceptArrowKeys property:

numericUpDown1.InterceptArrowKeys = true;

In this example, we set the InterceptArrowKeys property to true, enabling the use of the arrow keys to change numeric values. Other usage methods are basically the same as ordinary NumericUpDown controls.

It should be noted that when the InterceptArrowKeys property is enabled, the user can enter any number through the keyboard, not just numbers in the integer or floating point range. Therefore, to ensure the validity of the input data, you may need to use other validation techniques such as regular expressions or the TryParse method.

1.2 DecimalPlaces

The DecimalPlaces property of the NumericUpDown control is used to set the number of digits after the decimal point. The default value of this property is 0, which allows only integers to be entered. If you want to enter decimals, you need to set the DecimalPlaces property to the desired number of decimal places.

For example, suppose you want to create a NumericUpDown control that allows you to enter numbers with two decimal places. You can set the DecimalPlaces property to 2, the code is as follows:

numericUpDown1.DecimalPlaces = 2;

At this time, when the user enters a number, the NumericUpDown control will display a number with two digits after the decimal point. If the number entered by the user contains more than two decimal places, the NumericUpDown control will automatically round to two decimal places.

1.3 Increment

The Increment property of the numericUpDown control is used to set the increment of the control value, that is, the value by which the value increases or decreases each time the up and down arrows are pressed. The default value is 1.

For example, if you set the Increment property to 0.5, the value of the numericUpDown control will increase or decrease by 0.5 each time the up and down arrows are pressed. The Increment property can be set by the following code:

numericUpDown1.Increment = 0.5;

Of course, you can also directly set the value of this property in the designer.

1.4 Maximum and Minimum

In Winform, the NumericUpDown control is a control used to select a numeric value, usually used to set the range of numbers. When using the NumericUpDown control, we can set the maximum and minimum values ​​of the control, which can be achieved by setting the Maximum and Minimum properties.

Specific steps are as follows:

1. Open the Form Designer in Visual Studio, and drag the NumericUpDown control to the form.

2. Find the Maximum and Minimum properties in the property window, and set their values ​​to the maximum and minimum values ​​of the number range you want, respectively.

3. Save the form and run the program.

Now, your NumericUpDown control can select numeric values ​​within the specified range of numbers. When the selected numeric value is outside the set range, the control will automatically limit the input.

1.5 ThousandsSeparator

The ThousandsSeparator property of the numericUpDown control is used to control whether to add a thousand separator, that is, a comma, to the number.

If the ThousandsSeparator property is set to true, the numbers will be separated by the thousands separator, for example: 1,000. If the ThousandsSeparator property is set to false, the number will be displayed in normal format, eg: 1000.

The method of use is as follows:

1. Select the numericUpDown control in the form designer.

2. In the properties window set the ThousandsSeparator property to true or false, depending on your needs.

You can also set this property in code:

numericUpDown1.ThousandsSeparator = true; //开启千位分隔符
numericUpDown1.ThousandsSeparator = false; //关闭千位分隔符

1.6 Hexadecimal

The Hexadecimal property of the numericUpDown control can use the following steps:

1. Add a numericUpDown control to the Winform form.

2. Select the numericUpDown control and find its properties window.

3. Find the Hexadecimal property in the properties window and set it to True.

4. Run the program, the value of the numericUpDown control will be displayed in hexadecimal.

If you want to set the Hexadecimal property of the numericUpDown control in code, you can use the following code:

numericUpDown1.Hexadecimal = true;

1.7 UpDownAlign

The numericUpDown control is one of the commonly used controls in Winform and is used to input values. Among them, the UpDownAlign property is a property in the control, which is used to set the position of the up and down arrows of the control.

The UpDownAlign property has three optional values:

1. None: Arrows are not displayed.
2. Top: Arrows are displayed at the top of the control.
3. Bottom: Arrows are displayed at the bottom of the control.

The specific usage method is as follows:

1. Select the numericUpDown control in the designer.
2. Find the UpDownAlign property in the property window and select the appropriate value.

The sample code is as follows:

// 设置UpdownAlign属性为Top
this.numericUpDown1.UpDownAlign = System.Windows.Forms.LeftRightAlignment.Top;

Note that this property only takes effect when the Dock property of the control is set to None.

2. Common scenarios

The NumericUpDown control is one of the commonly used controls in Winform. Common usage scenarios include the following:

1. value adjustment

The NumericUpDown control can be used to adjust numerical parameters, such as volume, brightness, color saturation, etc. Users can change the value by clicking the up and down arrows or directly entering the value.

2. percentage adjustment

The NumericUpDown control can also be used to adjust percentages, such as scaling, transparency, and progress bars. By setting the Minimum and Maximum properties to 0 and 100, and then setting the Increment property to 1, you can achieve the effect of increasing or decreasing by 1% each time.

3. date and time selection

The NumericUpDown control can also be used to select dates and times. By setting the Minimum and Maximum properties to the date and time range to be selected, and then setting the Increment property to 1, the effect of increasing or decreasing by 1 day or 1 hour can be achieved each time.

4. Numerical statistics

The NumericUpDown control can also be used to display and edit numerical statistics, such as average, total, maximum, minimum, etc. By setting the ReadOnly property to true, the user is prohibited from editing the value and can only view it.

In short, the NumericUpDown control is a more convenient and practical control in scenarios that require numerical adjustment, percentage adjustment, date and time selection, and numerical statistics.

3. Specific cases

Here's an example Winform application that uses a numericUpDown control:

In Visual Studio, create a new Winform application and add a numericUpDown control and a button control to the Form1 form.

public partial class Form1 : Form
{
    
    
    public Form1()
    {
    
    
        InitializeComponent();
    }

    private void button1_Click(object sender, EventArgs e)
    {
    
    
        int value = (int)numericUpDown1.Value;
        MessageBox.Show("Selected value: " + value);
    }
}

In the above code, we get the Value property value of numericUpDown in button1's Click event handler and cast it to an integer. We then display the selected value in a message box.

When the user changes the value using the numericUpDown control, you can use the ValueChanged event to respond to the change. For example:

private void numericUpDown1_ValueChanged(object sender, EventArgs e)
{
    
    
    int value = (int)numericUpDown1.Value;
    label1.Text = "Selected value: " + value;
}

In the above code, we get the new value in numericUpDown1's ValueChanged event handler and display it in a label control on the form.