propertygrid同时显示numericupdown和slider

效果

 

 

在C# WinForms中，让PropertyGrid同时显示NumericUpDown和Slider控件来编辑同一个数值属性，可以通过自定义UITypeEditor来实现。下面是一个完整的解决方案。

🎯 实现思路概述

方法	核心思路	适用场景	优点
自定义UITypeEditor​	创建下拉编辑器同时包含NumericUpDown和TrackBar	需要直观的数值调整界面	用户体验好，操作直观
TypeConverter转换​	将自定义类型转换为PropertyGrid可识别的格式	复杂对象属性的显示与编辑	灵活性高，可处理复杂数据结构

⚙️ 具体实现步骤

1. 创建包含NumericUpDown和TrackBar的编辑控件

首先创建一个用户控件，同时包含NumericUpDown和TrackBar：

using System;
using System.Windows.Forms;

public class NumericUpDownSliderControl : UserControl
{
    private NumericUpDown numericUpDown;
    private TrackBar trackBar;
    private int _value;
    
    public event EventHandler ValueChanged;
    
    public int Value
    {
        get { return _value; }
        set 
        { 
            _value = value;
            numericUpDown.Value = value;
            trackBar.Value = value;
        }
    }
    
    public int Minimum
    {
        get { return (int)numericUpDown.Minimum; }
        set 
        { 
            numericUpDown.Minimum = value;
            trackBar.Minimum = value;
        }
    }
    
    public int Maximum
    {
        get { return (int)numericUpDown.Maximum; }
        set 
        { 
            numericUpDown.Maximum = value;
            trackBar.Maximum = value;
        }
    }
    
    public NumericUpDownSliderControl()
    {
        InitializeComponent();
        SetupEventHandlers();
    }
    
    private void InitializeComponent()
    {
        this.numericUpDown = new NumericUpDown();
        this.trackBar = new TrackBar();
        
        // 配置NumericUpDown
        numericUpDown.Location = new System.Drawing.Point(0, 0);
        numericUpDown.Size = new System.Drawing.Size(60, 20);
        numericUpDown.Minimum = 0;
        numericUpDown.Maximum = 100;
        
        // 配置TrackBar
        trackBar.Location = new System.Drawing.Point(65, 0);
        trackBar.Size = new System.Drawing.Size(135, 20);
        trackBar.Minimum = 0;
        trackBar.Maximum = 100;
        trackBar.TickFrequency = 10;
        
        // 配置用户控件
        this.Size = new System.Drawing.Size(200, 45);
        this.Controls.Add(numericUpDown);
        this.Controls.Add(trackBar);
    }
    
    private void SetupEventHandlers()
    {
        numericUpDown.ValueChanged += (s, e) =>
        {
            _value = (int)numericUpDown.Value;
            trackBar.Value = _value;
            ValueChanged?.Invoke(this, EventArgs.Empty);
        };
        
        trackBar.Scroll += (s, e) =>
        {
            _value = trackBar.Value;
            numericUpDown.Value = _value;
            ValueChanged?.Invoke(this, EventArgs.Empty);
        };
    }
}

2. 创建自定义UITypeEditor

继承UITypeEditor创建自定义编辑器，以下拉形式显示组合控件

using System;
using System.ComponentModel;
using System.Drawing.Design;
using System.Windows.Forms.Design;

public class NumericUpDownSliderEditor : UITypeEditor
{
    public override UITypeEditorEditStyle GetEditStyle(ITypeDescriptorContext context)
    {
        // 设置编辑风格为下拉模式[6](@ref)
        return UITypeEditorEditStyle.DropDown;
    }
    
    public override object EditValue(ITypeDescriptorContext context, IServiceProvider provider, object value)
    {
        // 获取编辑服务[6](@ref)
        IWindowsFormsEditorService editorService = 
            provider.GetService(typeof(IWindowsFormsEditorService)) as IWindowsFormsEditorService;
        
        if (editorService != null && value is int)
        {
            NumericUpDownSliderControl editorControl = new NumericUpDownSliderControl();
            editorControl.Value = (int)value;
            editorControl.Minimum = 0; // 可根据需要从属性获取范围
            editorControl.Maximum = 100;
            
            editorControl.ValueChanged += (s, e) =>
            {
                // 值改变时立即更新
                value = editorControl.Value;
            };
            
            editorService.DropDownControl(editorControl);
        }
        
        return value;
    }
}

3. 定义使用该编辑器的数据类

创建一个类，其属性使用自定义编辑器

using System.ComponentModel;

public class Settings
{
    private int _sliderValue = 50;
    
    [DisplayName("数值调节")]
    [Description("使用数字框和滑动条同时调节数值")]
    [Editor(typeof(NumericUpDownSliderEditor), typeof(System.Drawing.Design.UITypeEditor))]
    [DefaultValue(50)]
    public int SliderValue
    {
        get { return _sliderValue; }
        set 
        { 
            _sliderValue = value;
            // 可在此添加属性变化处理逻辑
        }
    }
    
    // 其他属性...
    [Category("基本设置")]
    public string Name { get; set; }
    
    [Category("基本设置")]
    [Description("普通数值属性")]
    public int NormalValue { get; set; }
}

4. 在窗体中使用PropertyGrid

最后，在窗体中添加PropertyGrid并绑定数据对象

public partial class MainForm : Form
{
    private PropertyGrid propertyGrid;
    private Settings settings;
    
    public MainForm()
    {
        InitializeComponent();
        SetupPropertyGrid();
    }
    
    private void SetupPropertyGrid()
    {
        // 创建PropertyGrid
        propertyGrid = new PropertyGrid();
        propertyGrid.Dock = DockStyle.Fill;
        propertyGrid.ToolbarVisible = true;
        propertyGrid.HelpVisible = true;
        
        // 创建设置对象并绑定
        settings = new Settings();
        propertyGrid.SelectedObject = settings;
        
        // 添加到窗体
        this.Controls.Add(propertyGrid);
        
        // 可选：添加值改变事件处理
        propertyGrid.PropertyValueChanged += (s, e) =>
        {
            MessageBox.Show($"值已更改为: {settings.SliderValue}");
        };
    }
}