【C#】在 WinForms 中使用 MVVM（Model-View-ViewModel） 设计模式

结合当前的 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();// 初始化 ViewModelviewModel = 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. 运行效果

当运行项目时：

1. 用户在文本框中输入文字。
2. 只有在文本框不为空时，提交按钮才会被启用（通过 IsSubmitEnabled 控制）。
3. 用户点击提交按钮后，输入的文字会被添加到列表框中，显示在界面上，输入框会被清空，等待新的输入。

6. 总结

• Model：DataModel 代表数据（用户输入内容），用于存储信息。
• View：MainView 是用户界面，负责展示控件。通过数据绑定与 ViewModel 交互。
• ViewModel：MainViewModel 负责处理用户输入和数据逻辑，它通过 UserInput 属性和 SubmitCommand 命令与视图交互。INotifyPropertyChanged 使得视图在 ViewModel 属性变化时自动更新。

这是一个基础的 MVVM 实例，它展示了如何在 WinForms 项目中使用 DevExpress 组件和 MVVM 模式来实现清晰的逻辑分离。通过 MVVM，界面（View）和逻辑（ViewModel）完全分离，代码更加模块化、易于测试和维护