@TOC

Mendix敏捷开发零基础学习《一》

一、环境依赖

1. Mendix账号： 需要用公司邮箱注册 注册地址： https://signup.mendix.com/link/signup/?ref=158899
2. 开发工具： MendixStudioPro 8.12.4 下载链接: https://pan.baidu.com/s/1BBdli6iJ2ZV5Y7uEJTkCuA 提取码: yttq
3. 系统要求： win10
4. 安装JDK： OpenJDK11U-jdk_x64_windows_hotspot_11.0.3_7 下载连接：https://pan.baidu.com/s/1PE4GBkBoL-8Wjx-mvelzVA 提取码：4cqt
5. 安装.NET环境： Microsoft .NET Framework 4.7.2 下载连接：https://pan.baidu.com/s/12LQqGpMFVKzyNcrUZGkinw 提取码：hosx
6. 安装C++环境： Microsoft Visual C++ 2010 SP1 Redistribution Package 下载连接：https://pan.baidu.com/s/11gVjinWdhY3J1XfX9VrPvg 提取码：sygg

二、业务场景

现有一学校，需要记录课程信息（课程信息里边包含该课程需要几天、价钱、说明等）、教师信息(姓名、邮箱等)、课程位置（标题、地址等）、报名人员（名称、地址、邮箱等）、课程培训活动等，方便维护系统。

三、需求分析

根据业务场景分析，我们需要创建五个数据模型（课程Courses、教师Teacher、地址Location、报名人员Trainee、课程培训活动TrainingEvent），分别来存储这些信息。下边列举一下具体的属性有哪些：

课程Courses： 属性| 备注|类型 -------- | -----|-------- Title|标题|String Description|说明|String Duration|需要多久/天|Integer Price|价钱|Decimal

教师Teacher： 属性| 备注|类型 -------- | -----|-------- Name|名称|String EmailAddress|邮箱地址|String

地址Location： 属性| 备注|类型 -------- | -----|-------- Name|名称|String Address|地址|String

报名人员Trainee： 属性| 备注|类型 -------- | -----|-------- Name|名字|String Address|地址|String EmailAddress|邮箱地址|String

课程培训活动TrainingEvent： 这是一个一对多的数据结构，所以需要依附于其他的数据表，下面会说到怎么配置，这里就列举需要创建的属性

属性| 备注|类型 -------- | -----|-------- startDate|开始时间|Date and time（这是Mendix提供的时间类型） endDate|结束时间|Date and time（这是Mendix提供的时间类型）

四、项目实现

根据以上分析结果，我们可以根据MendixStudioPro开发工具实现基础的业务场景，下面开始：

1、创建项目

1. 打开MendixStudioPro新创建一个空白项目，选择New App 按钮。
2. 选择Starter Apps，选择Blank App模版。这里有很多模版，有机会可以试试。
3. 然后点击Use this starting point开始使用当前模版
4. 我们在App Name填写项目名称，在EnableOnlineServices选择No（该选项是否需要联机服务，联机服务会很慢，所以选择NO。我们在本地也不需要联机服务！），在Project Directory选择项目要保存的路径。一般情况下只需要填写这三项内容即可。点击Create app创建我们的项目工程。
5. 我们新创建的工程，进来以后有我们常用的三大块，1.是我们页面的目录树。2.是我们设计页面的工作台。3.是我们常见的一些组件，比如按钮、表格等。

2、创建数据模型

1. 根据需求，我们首先需要创建数据模型，Mendix创建数据模型很简单，双击左侧目录树的DomainModel，然后在打开的页面点击Entity按钮，就会出来Entity的数据表。

2. 双击Entity数据表，设计课程Courses 数据结构，在弹出的页面上输入Name属性（当前实体的名称），然后点击New新建实体中的属性。

3. 在弹出的页面上输入Name（属性的名称），选择Type（数据类型）为String（字符类型），输入MAX length（最大长度）为200，然后点击OK。

4. 循环2-3步骤创建其他的属性，这里就不列举了，因为创建方式都是一样的。

5. 循环1-3步骤将其余的数据表结构创建好。

3、创建页面

1. 表结构有了，我们开始搭建我们的页面程序，点击左侧目录树的Home Web（该页面是我们程序的主入口）。
2. 我们根据业务场景需要先创建四个部分，第一部分是课程Courses，第二部分是地址Location，第三部分是教师Teacher，第四部分是报名人员Trainee，所以我们需要分为四列。 点击当前内容，右击该区域的上标题栏目右击选择Add column left添加四列。Mendix会自动将内容分为四等分。
3. 添加好四列以后，我们在3区域的Building blocks搜索组件card，选择Card Action组件，然后拖入到每一列当中。
4. 双击下列红框中，我们将图标进行更换
5. 在弹出的页面中点击Select按钮。
6. 在弹出的页面搜索book，选择下列图标，然后点击select按钮，就可以把当前图标更换为符合我们需求的图标。
7. 选择好以后，开发工具会自动跳转到第5步的页面，给他赋予一个点击事件，我们就让他点击以后跳转一个列表页面，在On click下拉列表中选择Show a page
8. 选择好以后系统会弹出一个选择页面的窗体，我们这时是没有页面的，所以点击New按钮新创建一个页面。
9. 我们在新弹出的窗口Page name中填写页面名称（需要英文），因为我们需要让他跳转到列表页所有选择Lists->List Default（默认列表页），在NavigationLayout下拉框中选择Atlas_Default选项（跳转），该选项是点击按钮以后页面的打开方式，弹出或跳转等。然后点击OK按钮
10. 开发工具会自动跳转到第5步的页面，然后点击OK按钮。该功能和页面就创建好了。
11. 创建完成以后，左侧目录树就会出现我们刚才创建的页面。
12. 说一个简单的方式，可以直接将Open Page按钮复制刚才我们的操作。就是将刚才创建的页面直接拖到Open Page上就可以了。
13. 拖好以后双击 Open Page按钮，将名字改为自己的，在Caption输入框中直接改，然后点击ok就可以了。
14. 其他几列也同样的循环4-13步骤，我这里列举一下需要选择图标、列名称、和页面命名。

名称| 图标|页面命名 -------- | -----| ----- Courses|book|Courses_Overview Locations|map|Locations_Overview Teachers|user|Teachers_Overview Trainess|education|Trainess_Overview

4、数据源绑定

1. 将其余的三列创建好以后，点击上方Run Locally按钮发现项目是运行报错，是因为我们还没有跟数据进行绑定。所以才会导致运行报错。
2. 将页面跟数据进行绑定，双击Courses_Overview页面，在UnKnown右击选择Select data source（选择数据源），
3. 在弹出的页面上点击Select按钮
4. 在弹出的页面上选择我们刚才创建的数据模型Courses，然后点击Select按钮。
5. 开发工具会自动跳转到3步骤，点击OK按钮，该页面就和Courses数据模型绑定成功。
6. 开发工具会弹出一个提示框来询问我们是否自动的响应页面属性，我们选择NO按钮不需要。

5、属性绑定

1. 双击 页面上的Title属性，在弹出的窗口选择Edit按钮，来跟数据模型中的属性进行绑定。

2. 在弹出的窗口上选择New按钮。

3. 在弹出的窗口上选择Select，开发工具会弹出Courses数据模型的所有属性，我们选择Title属性即可，然后点击Select按钮。

4. 点击OK按钮，完成选择

5. 然后系统会自动出现一个Index序号，我们将这个需要输入到Caption中（代表刚才双击页面上Title属性显示序号{1}的数据），然后点击OK按钮->OK按钮 完成数据绑定。

6. 循环 1-5步骤，将其他 属性 进行绑定。

7. 循环目录四、项目实现 的 4和5章节的步骤点击跳转，将其余的 页面 (Locations_Overview、Teachers_Overview、Trainess_Overview)进行数据绑定。然后我们点击Run Locally运行项目，然后点击View按钮进行预览。

8. 我们可以点击我们创建的四部分，进行查看。

6、数据新增

1. 我们可以发现，里边现在是空的，没有数据的。所以我们现在需要实现新增功能。
2. 我们现在以Courses_Overview列表页面为例，实现一下新增功能。双击目录树Courses_Overview页面，然后双击页面上Add按钮。
3. 我们在弹出的窗口On click下拉框中，选择Create object创建一个对象类型。
4. 选择好Create object后，开发工具会让我们选择对应的Entity（就是我们创建的数据模型），我们点击Select，在弹出的页面选择Courses数据模型，然后点击select按钮完成选择。
5. 紧接着我们在选择对应的页面，点击On click page中的Select按钮，来选择对应的新增页面。
6. 这个时候我们可以发现，我们是没有新增页面的，所以点击New按钮，创建一个新增页面。
7. 在弹出的页面会发现Page name会自动为我们创建名称，所以我们不需要更改。在Navigation layout下拉选项中选择PopupLayout（弹出页面方式），然后选择Forms中的Form Vertical。然后点击Ok->Ok按钮，完成页面创建。
8. 完成并保存以上操作以后，我们重新点击Run Locally 运行我们的项目，浏览一下。点击Courses菜单进入列表页，在列表页上点击右上角的Add按钮，这时候我们就可以发现，有弹出新增页面，可以新增数据了。
9. 然后我们重复当前章节的操作步骤，完成对其他 (Locations_Overview、Teachers_Overview、Trainess_Overview)页面的新增功能。这里就不一一列举了。步骤都是相同的，Entity选择对应的数据模型即可。完成以上操作以后，所有的列表页面都有新增功能了。

7、数据删除

1. 新增功能有了，肯定还需要用到删除功能，不能光新增不能删除对吧？接下来我们做一下删除功能，这里还是以Courses_Overview列表页面为例。双击打开Courses_Overview页面，在3号区域ToolBox中的widgets中搜索button按钮，找到Delete button，拖入到对应的位置，就完成删除的操作了。重复当前步骤完成其他 (Locations_Overview、Teachers_Overview、Trainess_Overview)页面的删除功能。

8、关系型数据模型

1. 经过以上操作我们就大体实现了四大模块（课程、老师、地址、学员）的新增和删除工作了。现在根据学校的实际需求出发，学校的维护人员需要发布培训活动，培训活动需要包含课程和培训课程的老师，还有培训地址，方便学员进行报名。需求分析完毕，接下来我们开始操作。我们首先需要在数据模型中将TrainingEvent（培训活动）的模型与课程、老师、地址进行一对多的关联，方便维护人员进行维护，双击 左侧目录树中的DoMain Model，然后在打开的窗口中从TrainingEvent模型向其他三个模型（Courses、Teacher、Location）拉箭头，就可以完成模型一对多的绑定。
2. 数据模型绑定成功以后，我们需要在Home_Web主页面添加新模块的入口，首先介绍一下在MendixPro中怎么操作表格。

• 如何选择行: 鼠标点击下图所示区域是选择一整行
• 如何选择列: 鼠标点击下图所示区域是选择对应的列
• 如何选择表格: 鼠标点击下图所示区域是选择整个表格

3. 双击左侧目录树中的Home_Web页面，然后选择行以后鼠标右击选择Insert row below。
4. 选择Insert row below以后，页面会出现让我们选择将新建的行分成几等份，我们直接跟上一行一样，分成四等份即可。
5. 参考目录四中的3.创建页面章节的3-13的小节完成页面创建点击跳转，参考目录四中的4.数据源绑定小节完成数据源绑定点击跳转， 参考目录四中的5.属性绑定 小节完成属性绑定点击跳转， 参考目录四中的6.数据新增 小节完成数据新增点击跳转，我这边列出来页面命名、图标、以及名称。

名称| 图标|页面命名 -------- | -----| ----- TrainingEvent|calendar|TrainingEvent_Overview 5. 完成以上操作以后，我们就可以对培训活动进行新增操作，我们可以看到在新增页面会自动带出课程和培训课程的老师，还有培训地址信息，到这一步就完成了关系型一对多数据模型的创建。