NumberBox 是一个功能丰富的数字输入框控件，支持增减按钮、精度控制、范围限制等功能。适用于数值输入、数量选择等场景。
一、示例图
如有前缀和后缀文本时，悬停出现增减按钮，离开提示文本。可以不用为输入框单独设置说明文本，也可以带计量单位等用途，非常个性。
二、使用说明
NumberBox 数字输入框控件
控件名称
NumberBox
中文名称
数字输入框控件
控件优点
NumberBox 是一个功能丰富的数字输入框控件，支持增减按钮、精度控制、范围限制等功能。适用于数值输入、数量选择等场景。
主要特性
- 增减按钮：支持点击按钮增减数值
- 精度控制：支持设置小数位数
- 范围限制：支持设置最小值和最大值
- 步长设置：支持设置增减步长
- 键盘输入：支持直接键盘输入数值
- 长按连续：支持长按按钮连续增减
- 鼠标滚轮：支持鼠标滚轮控制数值增减
- 自定义按钮文本：支持自定义增减按钮的符号文本
重要参数说明
基本属性
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
Value |
decimal | 0 | 当前值 |
MinValue |
decimal | 0 | 最小值 |
MaxValue |
decimal | 100 | 最大值 |
Step |
decimal | 1 | 增减步长 |
Precision |
int | 0 | 小数位数 |
外观属性
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
ButtonColor |
Color | 245, 245, 245 | 按钮颜色 |
ButtonHoverColor |
Color | 230, 230, 230 | 按钮悬停颜色 |
ButtonPressedColor |
Color | 220, 220, 220 | 按钮按下颜色 |
BorderColor |
Color | 200, 200, 200 | 边框颜色 |
TextBoxColor |
Color | White | 文本框颜色 |
ButtonSignColor |
Color | 80, 80, 80 | 按钮符号颜色 |
PlaceholderColor |
Color | Gray | 占位符颜色 |
CornerRadius |
int | 4 | 圆角半径 |
ButtonWidth |
int | 35 | 按钮宽度 |
其他属性
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
Placeholder |
string | "" | 占位符文本 |
PrefixText |
string | "" | 减号按钮文本前缀（智能显示：默认显示文本，悬停时显示减号符号） |
SuffixText |
string | "" | 加号按钮文本后缀（智能显示：默认显示文本，悬停时显示加号符号） |
ControlPadding |
Padding | 1 | 控件内边距 |
主题支持
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
FollowGlobalTheme |
bool | true | 是否跟随全局主题变化 |
主题颜色说明：
| 元素 | 亮色模式 | 暗色模式 |
|---|---|---|
| 背景色 | 白色 | 深灰 (45,45,48) |
| 边框颜色 | 浅灰 (200,200,200) | 深灰 (80,80,80) |
| 按钮颜色 | 浅灰 (245,245,245) | 深灰 (60,60,60) |
| 按钮悬停 | 浅蓝灰 | 深蓝灰 |
| 按钮按下 | 蓝灰 | 深灰 |
| 文字颜色 | 深灰 | 浅灰 |
| 按钮符号颜色 | 中灰 | 浅灰 |
| 占位符颜色 | 灰色 | 深灰 (100,100,100) |
重要事件
| 事件名 | 说明 |
|---|---|
ValueChanged |
数值改变时触发 |
PropertyChanged |
属性值改变时触发 |
使用示例
基本使用
csharp
// 创建数字输入框
NumberBox numberBox = new NumberBox();
numberBox.Size = new Size(150, 32);
this.Controls.Add(numberBox);
// 数值改变事件
numberBox.ValueChanged += (sender, e) =>
{
Console.WriteLine($"当前值：{numberBox.Value}");
};范围限制
csharp
// 设置范围
numberBox.MinValue = 0;
numberBox.MaxValue = 100;
numberBox.Value = 50;精度控制
csharp
// 设置小数位数
numberBox.Precision = 2; // 保留2位小数
numberBox.Step = 0.1m; // 步长0.1步长设置
csharp
// 设置步长
numberBox.Step = 5; // 每次增减5颜色自定义
csharp
// 设置颜色
numberBox.ButtonColor = Color.LightGray;
numberBox.ButtonHoverColor = Color.Gray;
numberBox.ButtonPressedColor = Color.DarkGray;
numberBox.BorderColor = Color.Gray;
numberBox.TextBoxColor = Color.White;圆角设置
csharp
// 设置圆角
numberBox.CornerRadius = 8;
// 直角
numberBox.CornerRadius = 0;占位符
csharp
// 设置占位符
numberBox.Placeholder = "请输入数量";自定义按钮文本（智能显示模式）
csharp
// 设置减号按钮文本前缀（智能显示模式）
numberBox.PrefixText = "温度"; // 默认显示"温度"，鼠标悬停时显示"-"符号
numberBox.PrefixText = "min"; // 默认显示"min"，鼠标悬停时显示"-"符号
// 设置加号按钮文本后缀（智能显示模式）
numberBox.SuffixText = "℃"; // 默认显示"℃"，鼠标悬停时显示"+"符号
numberBox.SuffixText = "max"; // 默认显示"max"，鼠标悬停时显示"+"符号
// 清除自定义文本，恢复默认符号
numberBox.PrefixText = ""; // 始终显示"-"符号
numberBox.SuffixText = ""; // 始终显示"+"符号智能显示模式说明：
- 默认状态：显示自定义文本（如单位、标签等信息）
- 鼠标悬停：自动切换为增减符号，提示用户可以点击操作
- 空文本：始终显示默认的增减符号
这种交互方式既保持了信息展示（显示单位或标签），又在用户操作时清晰提示功能（显示增减符号）。
鼠标滚轮控制
csharp
// 鼠标悬停在控件上时，可通过滚轮控制数值增减
// 向上滚动增加数值，向下滚动减少数值
// 增减幅度由 Step 属性控制
numberBox.Step = 0.5m; // 设置步长数据绑定
csharp
// 属性改变事件
numberBox.PropertyChanged += (sender, e) =>
{
if (e.PropertyName == nameof(NumberBox.Value))
{
Console.WriteLine($"数值已更改：{numberBox.Value}");
}
};
// 绑定到数据源
numberBox.DataBindings.Add("Value", dataSource, "Quantity");注意事项
- 数值范围：Value 会被限制在 MinValue 和 MaxValue 之间
- 精度控制：Precision 控制显示的小数位数
- 步长设置：点击增减按钮时按 Step 值变化
- 长按连续：长按增减按钮会连续变化数值
- 鼠标滚轮：鼠标悬停时滚轮会改变数值，建议在只读或失能状态时禁用
- 自定义按钮文本：当 PrefixText 或 SuffixText 为空时显示默认符号，非空时显示自定义文本，文本会自动调整大小以适应按钮宽度
三、后记
更多期待，敬请关注，如有需求、好的建议，请留言(xue5zhijing)