界面控件DevExpress WinForms MVVM入门教程——创建主、详细视图

在上文中，Scaffolding Wizard 为您创建了ViewModel，现在您需要创建与这些ViewModel相关的视图。

获取工具下载 - DevExpress v21.2

主视图

主应用程序视图是您的主要应用程序表单。 要构建其内容，请删除任何适当的内容容器（NavigationFrame, DocumentManager, XtraTabControl等）和包含打开模块按钮的 RibbonControl 。

提示：所选内容容器的类型将影响您以后需要使用的服务。 如果您根本不删除任何内容容器，将需要使用 WindowedDocumentManagerService 并且所有模块都将作为单独的表单打开。

例如您选择了文档管理器，在这种情况下，您的主视图将如下所示。

将所有功能区项目保留为fakes - 您将在下一步中提供它们的功能。

最后，将 MvvmContext 组件拖放到表单上，并在其智能标记中选择与此视图关联的主视图模型。 由 Scaffolding Wizard 生成的主 ViewModel 将被称为 ViewModel。

详细视图

上一步中生成的Account、Transaction 和 Category 实体的 ViewModel 已经具有基本功能 - 创建新记录、添加和删除现有记录等，现在为这些 ViewModel 中的每一个创建一个相关的视图。

1. 添加一个新的 Views 解决方案文件夹，其中包含三个子文件夹：Account、Category 和 Transaction。 为每个文件夹放置一个新的 UserControl - 这些将是您的详细视图（参见下图）。

2. 打开 AccountView 用户控件并创建一个简单的 UI - 显示帐户的 GridControl 和执行简单操作（添加、创建、修改和删除帐户）的 RibbonControl，可以得到这样的结果：

3. 与主视图类似，将 MvvmContext 组件拖放到用户控件上，并将 AccountCollectionViewModel 设置为相关的 ViewModel。

重要提示：Scaffolding Wizard 将为每个表生成两个 ViewModel，存储在 DbContext 中。 例如，对于 Transactions 表，它将生成 TransactionsViewModel 和 TransactionsCollectionViewModel。 第一个 ViewModel 设计用于处理单个事务对象，适用于稍后创建的编辑表单；第二个 ViewModel 与整个交易集合一起使用，应该在详细视图中使用。

4. 现在您需要将项目添加到您的 RibbonControl，与主 ViewModel 不同，在这里您可以自动生成项目。 您自动生成的 AccountCollectionViewModel 派生自父 CollectionViewModel，它声明了使用集合的基本方法 - 添加新对象、刷新集合、编辑当前对象等，此功能位于命令中。MvvmContext 组件能够从 ViewModel 检索命令并将相应的按钮添加到 RibbonControl，为此，请调用组件智能标签并单击 ‘Retrieve Commands’链接。

这将检索四个命令 - 新建、编辑、刷新和删除，将为它们中的每一个创建一个相应的 RibbonControl 项。 重建解决方案，这些自动生成的项目将自动从图像库和上下文相关图像接收适当的图像。

5. 如果您检查 CollectionViewModel，将看到此 ViewModel 声明的命令比添加到功能区控件的这四个命令还多。 未添加所有剩余命令的原因是因为它们标有特定的显示Data Annotation Attribute，该属性从命令编辑器中“隐藏”了此命令。

C#

[Display(AutoGenerateField = false)]
public void Close() {
if(DocumentOwner != null)
DocumentOwner.Close(this);
}

VB.NET

Public Sub Close()
If DocumentOwner IsNot Nothing Then
DocumentOwner.Close(Me)
End If
End Sub

要为编辑器 ‘open’ 此命令，请将 false 替换为 true 或简单地删除整个属性。 当您这样做时， ‘Close’ 命令应出现在命令编辑器中，您将能够为其生成功能区项目。

进一步的 CollectionViewModel 检查将显示一些命令，如‘Edit’和‘Delete’，后面跟着相应的布尔值“Can…”属性。 在 POCO ViewModels 中，此类属性充当 CanExecute 条件，指定相关命令当前是否可用，因此绑定到该命令的 UI 元素当前是否启用。

C#

public bool CanEdit(TProjection projectionEntity) {
return projectionEntity != null && !IsLoading;
}

VB.NET

Public Function CanEdit(ByVal projectionEntity As TProjection) As Boolean
Return projectionEntity IsNot Nothing AndAlso Not IsLoading
End Function

这是一种合理的方法，因为如果当前没有选择集合对象（例如，特定交易），您将无法单击‘Edit’等按钮。 这意味着 Scaffolding Wizard 也会处理这些细节，您无需手动实现此逻辑。

6. 重复前面的步骤，为 CategoriesCollection 和 TransactionsCollection ViewModels 创建类似的详细视图。

DevExpress WinForm | 下载试用

DevExpress WinForm拥有180+组件和UI库，能为Windows Forms平台创建具有影响力的业务解决方案。DevExpress WinForms能完美构建流畅、美观且易于使用的应用程序，无论是Office风格的界面，还是分析处理大批量的业务数据，它都能轻松胜任！

---

DevExpress技术交流群5：742234706      欢迎一起进群讨论

更多DevExpress线上公开课、中文教程资讯请上中文网获取