
结合当前的 DevExpress 项目,在 WinForms 中使用 MVVM(Model-View-ViewModel) 设计模式。这个例子将通过数据绑定、命令绑定来展示 MVVM 模式的运用。
1. 项目结构
假设我们要实现一个简单的应用程序,它有一个文本框和一个按钮,用户输入内容后点击按钮,内容会显示在列表框中。这种交互将通过 MVVM 设计模式来完成,且我们会使用 DevExpress 的控件。
项目结构如下:
DXApplication1
├── Model
│   └── DataModel.cs        // 模型,表示数据
├── View
│   ├── MainView.cs         // 视图,WinForms 窗体
│   ├── MainView.Designer.cs // 设计器自动生成的代码
│   └── MainView.resx       // 窗体资源文件
└── ViewModel
    └── MainViewModel.cs    // 视图模型,处理逻辑和数据绑定
2. Model (数据模型)
首先,我们创建一个数据模型来存储用户输入的数据。
// Model/DataModel.cs
namespace DXApplication1.Model
{
    public class DataModel
    {
        public string UserInput { get; set; }
        public DataModel(string userInput)
        {
            UserInput = userInput;
        }
    }
}
这个 DataModel 类是一个简单的数据结构,用来存储用户输入的字符串。
3. View (视图)
在 MainView.cs 中,我们设计一个界面,有一个文本框、一个按钮和一个列表框。我们使用 DevExpress 提供的控件来展示这些元素。
// View/MainView.cs
using System;
using System.Windows.Forms;
using DevExpress.XtraEditors;
using DXApplication1.ViewModel;
namespace DXApplication1.View
{
    public partial class MainView : DevExpress.XtraEditors.XtraForm
    {
        private MainViewModel viewModel;
        public MainView()
        {
            InitializeComponent();
            // 初始化 ViewModel
         viewModel = new MainViewModel();
            this.DataBindings.Add(new Binding("Text", viewModel, "WindowTitle")); // 绑定窗体标题
            this.textEditUserInput.DataBindings.Add(new Binding("Text", viewModel, "UserInput", true, DataSourceUpdateMode.OnPropertyChanged));
            this.simpleButtonSubmit.DataBindings.Add(new Binding("Enabled", viewModel, "IsSubmitEnabled"));
            this.listBoxControlOutput.DataSource = viewModel.Items;
            // 将按钮点击事件绑定到 ViewModel 的命令
            this.simpleButtonSubmit.Click += (s, e) => viewModel.SubmitCommand.Execute(null);
        }
    }
}
关键点:
- 数据绑定:文本框绑定到 UserInput属性,列表框绑定到Items集合。
- 按钮点击事件:按钮点击事件绑定到 ViewModel 的 SubmitCommand命令。
我们假设 InitializeComponent() 方法自动生成了如下控件:
- textEditUserInput:文本框,用于输入用户内容。
- simpleButtonSubmit:按钮,用于提交输入。
- listBoxControlOutput:列表框,用于显示提交后的内容。
4. ViewModel (视图模型)
在 ViewModel 中,我们管理用户的输入和提交逻辑。这个 ViewModel 负责处理所有与视图的交互,并使用 INotifyPropertyChanged 来实现数据绑定。
// ViewModel/MainViewModel.cs
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Windows.Input;
using DevExpress.Mvvm;
using DXApplication1.Model;
namespace DXApplication1.ViewModel
{
    public class MainViewModel : ViewModelBase
    {
        private string userInput;
        private bool isSubmitEnabled;
        public MainViewModel()
        {
            Items = new ObservableCollection<DataModel>();
            SubmitCommand = new DelegateCommand(OnSubmit, CanSubmit);
        }
        // 绑定到输入框的属性
        public string UserInput
        {
            get => userInput;
            set
            {
                if (SetProperty(ref userInput, value, nameof(UserInput)))
                {
                    // 每次修改输入时,检查是否可以提交
                    isSubmitEnabled = !string.IsNullOrWhiteSpace(userInput);
                    RaisePropertyChanged(nameof(IsSubmitEnabled));
                }
            }
        }
        // 提交按钮是否可用
        public bool IsSubmitEnabled => isSubmitEnabled;
        // 提交命令
        public ICommand SubmitCommand { get; }
        // 存储用户提交的列表
        public ObservableCollection<DataModel> Items { get; }
        // 提交按钮的逻辑
        private void OnSubmit()
        {
            // 将输入添加到列表中
            Items.Add(new DataModel(UserInput));
            UserInput = string.Empty;  // 清空输入框
        }
        // 提交按钮是否可用的逻辑
        private bool CanSubmit()
        {
            return !string.IsNullOrWhiteSpace(UserInput);
        }
    }
}
关键点:
- UserInput:与视图中的输入框绑定,用户在输入框中的内容通过 UserInput属性与视图模型中的数据同步。
- Items:与列表框绑定,存储用户提交的所有输入内容。
- SubmitCommand:与按钮绑定,处理提交逻辑。我们使用了 DevExpress 提供的 DelegateCommand来处理按钮的点击事件。
- INotifyPropertyChanged:通过继承 ViewModelBase,视图模型自动支持属性变更通知,使得视图可以根据属性变化更新。
5. 运行效果
当运行项目时:
- 用户在文本框中输入文字。
- 只有在文本框不为空时,提交按钮才会被启用(通过 IsSubmitEnabled控制)。
- 用户点击提交按钮后,输入的文字会被添加到列表框中,显示在界面上,输入框会被清空,等待新的输入。
6. 总结
- Model:DataModel代表数据(用户输入内容),用于存储信息。
- View:MainView是用户界面,负责展示控件。通过数据绑定与 ViewModel 交互。
- ViewModel:MainViewModel负责处理用户输入和数据逻辑,它通过UserInput属性和SubmitCommand命令与视图交互。INotifyPropertyChanged使得视图在 ViewModel 属性变化时自动更新。
这是一个基础的 MVVM 实例,它展示了如何在 WinForms 项目中使用 DevExpress 组件和 MVVM 模式来实现清晰的逻辑分离。通过 MVVM,界面(View)和逻辑(ViewModel)完全分离,代码更加模块化、易于测试和维护



















