EntityUI 自动 UI 生成器，使用 CodeFirst 方法

• 下载源代码 - 1.7 MB

引言

EntityUI 本质上是一种思想，能够在 ASP.NET 应用程序中使用 Code First 方法创建用户界面。我认为大多数程序员都会同意，CRUD 和基本 UI 界面是应用程序设计中最烦人、最重复的部分，尤其是对于业务应用程序。对我来说绝对是这样。

对我来说，最理想的情况是编写我的类，然后只需调用 `.Save` 或 `.Load` 或 `.Render`，它就会自动完成。这就是 EntityUI 的理念。

背景

微软一直在努力解决这个问题，他们提出了半不错的工具。他们使用 `GridView` 或 `FormView` 来渲染 UI，并使用 `SQLDataSource` 快速编写 CRUD。如果你只是快速创建一个页面并且从不维护它，那么它非常棒，效果也很好，但对于具有良好分层框架的真实应用程序，效果就不那么好了。然后我们有了 Dynamic Controls，而最新的努力似乎是 LightSwitch。我对如何渲染 UI 有不同的想法，并且我认为它更简单，因为它始于开发人员编写的类，并且将非常灵活。

我最初是从 Save 和 Load 设计开始的，但后来微软发布了 Entity Framework 4.1，它引入了 Code First 方法，并且在某种程度上处理了 CRUD。信不信由你，我有一个非常相似的设计。无论如何，他们抢先一步，既然有了这个，我想开始做 UI 部分，这将为开发人员提供一个类似的工具。它的工作原理是，通过类的属性，EntityUI 框架将创建用户界面。

Using the Code

源代码的第一个草稿演示了这个想法是如何工作的。基本上，它表明你编写你的类，然后只需几行代码，你就可以渲染你的 UI 了！

这是我们将在本例中使用的模型类

   Public Class Department
       Public Sub New()
           Me.Courses = New HashSet(Of Course)()
       End Sub
   
       ' Primary key
       Public Property DepartmentID As Integer
       Public Property Name As String
       Public Property Budget As Decimal
       Public Property StartDate As System.DateTime
       Public Property Administrator As System.Nullable(Of Integer)
   
       ' Navigation property
       Public Overridable Property Courses As ICollection(Of Course)
   End Class

基本上，我用于渲染 UI 的模型类与微软在其 Code First Fluent API 示例 中使用的模型类相同。

它非常直接，并具有几个不言自明的属性。

接下来，我们将编写渲染上述模型 UI 的代码。以下是执行 UI 渲染的代码

' Instantiate School Class with Events
Protected WithEvents Departments As New EntityUI(Of Department)

Protected Sub Page_Load(ByVal sender As Object, _
          ByVal e As System.EventArgs) Handles Me.Load

    ' Example on how to use EntityUI to automatically Render Input control
    PlaceHolderUI.Controls.Add(Departments.RenderInputPanel())

End Sub

在上面的代码中，我们首先使用 `Type` Department 的 EntityUI 框架创建一个页面级别的属性“`Departments`”。

在 page load 中，我们使用 EntityUI 框架的“`RenderInputPanel()`”方法，该方法基本上返回一个 ASP.NET 面板控件，其中包含根据属性类型，为我们模型类的每个属性生成的标签和输入字段。

该框架还提供了几个事件。以下代码显示了如何处理“`InputSaved`”事件。

     Sub SaveClicked() Handles Departments.InputSaved
          ScriptManager.RegisterStartupScript(Me.Page, Page.GetType, _
          "saveclicked", "alert('You pressed Save');", True)
     End Sub

布局由标准的 CSS 样式控制。`EntityUI.css` 文件应包含在目标 Web 应用程序中，以便应用这些样式。

请注意，这不是一个成品或最终代码。这相当不完整，大概是 0.2 版本。

目标是基本上自动生成该类的 UI，类似于 Entity Framework 生成 SQL CRUD。

目前，EntityUI 框架几乎只适用于基本的 `DataTypes`，如 `String`、`Int` 和 `Date`。项目的最终目标/范围是允许开发人员拥有绝对的控制权和灵活性，以及以下选项

• 添加更多输入类型（如货币、时间等）并提供验证
• 能够覆盖默认渲染方法
• 能够使用配置类控制哪些属性/验证器/按钮显示
• 能够覆盖默认 CSS 样式元素
• 实现 `DropDownList` 和 `AutoComplete` 功能
• 能够为 `List` 渲染 `Grid`

如果您想做出贡献并协助开发，请告诉我。

更新

我偶尔会收到关于 EntityUI 的电子邮件，所以在这里发布一下自原始帖子以来的状态更新。我在 EntityUI 中添加了一些控件和功能，但它仍未完成。我现在正在大量使用 knockout 来在我的代码中实现 MVVM 模式，它非常棒。我正在尝试在 EntityUI 中也使用 knockout。希望很快会有新代码。

我还一直在开发一个使用 Entity UI 的完整应用程序，该应用程序允许用户创建自己的输入表单，然后将其保存在数据库中。该应用程序名为 Social Corporate，目前处于 www.socialcorporate.com 的测试阶段。它是免费的。我将非常感谢其他开发人员的反馈，如果有任何人有兴趣将其集成到他们的项目中，请告诉我。