1. 通用控件

1.1 按钮

 

点击按钮，触发相关事件。

工具栏属性：

控件名称：JGMButton

标题：可定义按钮控件的标题名称；

背景色：设置控件的背景颜色；

前景色：设置控件文本的字体颜色；

上/左边距：设置控件与父容器上/左边的间距；

标签字体：设置按钮控件的字体样式；

边框样式/宽度/颜色：分别设置按钮控件的边框的样式、宽度，以及颜色；

圆角半径：根据按钮控件的选择的形状（圆形/矩形），进行半径大小的设置；

使能/显示：有，可设置为True/False；

事件：点击按钮事件；

图标：可选择系统图标修饰按钮，选择图标后可设置图标的位置；

图标位置：左/右；

示例：

1.2 图片

用户可在设计器上插入图片。

工具栏属性：

控件名称：JGMImage

上/左边距：设置控件与父容器上/左边的间距；

背景色：设置控件的背景颜色；

图片资源：选择资源管理器中的图片，作为图片的默认值；

图片位置：可设置图片在容器中的显示方式，有适应、居中、拉伸和填充几种方式。

边框样式/宽度/颜色：分别设置按钮控件的边框的样式、宽度，以及颜色；

圆角半径：根据按钮控件的选择的形状（圆形/矩形），进行半径大小的设置；

显示：有，可设置为True/False；

事件：单击事件，单击该图片，触发对应设置的事件；

数据设置：

①实体名：绑定实体，即对应的实体编码；

②字段名称：设置在图片上传时，对应的文件标识字段。

示例：以图片位置为例，分别设置为适应和拉伸：

（布局效果）

1.3 动态列表组

动态列表组控件主要是以列表的方式展示数据，提供了多种列表模板，满足用户的各种界面布局需求。

工具栏属性：

控件名称：JGMTrendList

加载模式：设置动态列表在加载数据时的模式，可设置为：all（全部加载）/paged（分页加载）；

分页加载条数：设置每页显示的数据条数（只有当加载模式为paged时，才可设置）；

显示分组：设置动态列表控件是否已分组的模式显示数据，可设置为True/False；

显示表头：设置控件的表头是否显示，可设置为True/False；

显示表尾：设置控件的表尾是否显示，可设置为True/False；

自动隐藏表头表尾：设置控件的是否自动隐藏表头表尾，可设置为True/False（主要体现页面内容多时，滑动页面，如果为True，表头/表尾固定；如果为False，表头/表尾随页面滚动）；

只读：有，可设置为True/False；

事件：值加载事件/下拉刷新事件/单击事件/记录切换事件；

数据设置：

①实体名：绑定实体，即对应的实体编码

②分组字段：设置需要分组的字段（如果不需要分组，该字段设置可省略）

③空数据提示文字：设置当列表数据为空时，显示的提示文字；

④空数据提示图片：设置当列表数据为空时，显示的提示图片；

使用动态列表组的步骤：

①添加动态列表组控件，然后设置它的基本属性，例如加载模式、是否显示表头/表尾等；

②添加实体，然后将动态列表组控件与实体进行绑定（必须），根据实际需求是否绑定分组字段，以及是否设置空数据时的提示文字/图片；

③添加“分组头模板1”（有2种，一种为固定样式，一种编辑html代码，生成对应的Key字段，但该步骤是非必须步骤，可根据实际业务需求增/删）；

④添加列表内容展示的模板（有8种，一个动态列表组控件，有且只能添加一种模板）；

注：动态列表组，自定义模板的图标绑定字段，需要根据图片的文件标识字段，使用函数进行转义，获取图的URL路径。例如：GetImageUrlByFileId([Traveldetail].[b])

即，自定义模板中的图标绑定的字段值，必须是图片的URL值（除了自由布局行模板除外，添加的图片控件绑定图片标识字段，不需要转义；以及自定义行模板4）。

⑤设置自定义模板，进行数据配置，绑定实体字段等（注，在数据配置的字段中，可根据实际业务需求绑定需要的字段即可）；

示例：

①添加“通信录模板”

第一步，添加实体。（特别注意，在动态列表组模板的图标绑定字段，需要根据图片的文件标识字段，使用函数进行转义，获取图的URL路径，所以需要在实体中添加一个字段，用于转义使用，例如：GetImageUrlByFileId([Traveldetail].[b])，如下图）

第二步，定义窗体，绑定数据。

（窗体布局）

（层级树）

第三步，定义表头表尾（可根据实际的业务需求，增/删该步骤）；

在本示例中，添加了表头，并在表头中添加了一个导航栏，导航栏中内置了一个搜索控件，如下图：

第四步，选中“分组头模板1”，进行设置；

（注，添加了分组头模板，那么在“动态列表组”控件中，必须绑定分组字段）

在分组头模板中，可设置背景色、标题颜色等，也可根据实际的业务需求，添加按钮图标和按钮文字，并添加了单击事件，如下图：

第五步，选中“通讯录模板”，进行设置（该模板可设置是否多选）；

（通讯录模板设置）

第六步，根据实际的业务需求，添加需要的事件，配置规则（在这里只给出部分事件的演示）；

如果动态列表数据为空时，希望“显示空数据提示”，那么需要在对应的事件中，进行判断，如实体（表）数据为空，需要设置“显示空数据提示文字和图片”的属性设置为True，如下：

其中，这里的实体数据是通过普通窗体添加，那么在实际的业务中，需根据实际的需求配置界面及规则。

该数据如下，普通窗体的配置：略。

第七步，部署并预览移动端效果；

 

②添加“自定义行模板1”/“自定义行模板2”/“自定义行模板3”/“自定义行模板4”

以上几种模板的使用步骤与“通讯录模板”一样，这里将省略（请参考“通讯录模板”的使用过程），预览效果分别如下：

“自定义行模板1”的预览效果：

“自定义行模板2”的预览效果：

“自定义行模板3”的预览效果：

“自定义行模板4”的预览效果：

注意：自定义行模板4中，在绑定实体字段时，其中key字段“icon1”绑定的实体字段，数据来源只支持系统的图标，否则不显示。

③添加“可编辑行模板”

该模板的属性面板“自定义模板”已默认设置好，用户无需进行配置。

用户需要配置“字段”属性，【字段名称】和【字段编码】可以手动添加，【来源字段】需要根据绑定的实体字段选择。

新打开字段编辑器，默认会产生一个标题字段，且这个字段是不可删除的，如下图：

（设置实体前）

以家庭状况（jtzk）实体为例，如字段设置如下：

（设置实体后）

绑定“修改分组行记录事件”和“删除分组行记录事件”，可对可编辑模板里面的每一行记录进行修改和删除，需要根据实际业务需求配置需要的规则；如果在实际业务过程中，如不需要对数据进行删除或者修改，可以隐藏该按钮，具体操作是将动态列表组控件设置为只读，如下图：

 

下面以家庭状况为例，预览移动端的效果（布局页面步骤：略），如下图：

（预览效果1）   

（预览效果2）  

④添加“自定义空白行模板”

该模板的数据配置中为空，用户可以根据实际的业务需求通过编辑html代码，生成对应的Key字段，如下：

（未编辑前）

（编辑后）

当代码编辑完成后，后面的字段绑定和设置，与通讯录模板的步骤一样（可参考“通信录模板”的配置过程），这里将省略，只显示预览效果。

（布局效果）

 

（预览效果）

⑤添加“自由布局行模板”

自由布局行模板，指列表行模板布局未定义，用户可根据实际的业务需求，通过工具箱添加对应的控件置于模板中，其中添加的控件使用与单个添加时使用类似，注意其绑定数据源实体，必须和动态列表组绑定的实体一致，若添加图片控件，直接绑定文件标识字段即可，不再需要转义。

在添加动态列表组控件时，其添加和绑定实体步骤与“通讯录模板”一样，这里将省略，直接介绍“自由布局行模板”的属性设置，如下：

注：【扩展域】属性，可设置为无/首部/尾部/首尾。主要满足某些业务场景，当页面宽度变化时，该部分区域的模式为固定宽度还是等比例宽度，如下：

在本示例中，在自由布局行模板中依此添加了图片、标签、多行文本和图标控件，作为列表的显示内容部分，如下：

（布局效果）

（预览效果）

⑥添加“分组头模板”

分组头模板，指列表分组头模板布局未定义，用户可根据实际的业务需求，通过工具箱添加对应的控件

置于模板中，其中添加的控件使用与单个添加时使用类似，注意其绑定数据源实体，必须和动态列表组绑定的实体一致，若添加图片控件，直接绑定文件标识字段即可，不再需要转义。

其使用步骤与“自由布局行模板”一样，这里将省略。一般使用分组头模板的场景，如下：

（预览效果）

 

1.4 自定义列表组

自定义列表组主要是实现页面分组布局的需求，界面划分成“一列多行（组）”的n个模块（注，该控件单独添加使用，一般单独适用于空白的页面（或者仅存放导航栏控件）、或者在页签控件添加的页签中添加使用等，但不能置于组合后panel中）。

工具栏属性：

控件名称：JGMQuietList

显示表头：设置控件的表头是否显示，可设置为True/False；

显示表尾：设置控件的表尾是否显示，可设置为True/False；

自动隐藏表头表尾：设置控件的是否自动隐藏表头表尾，可设置为True/False（主要体现页面内容多时，滑动页面，如果为True，表头/表尾固定；如果为False，表头/表位岁页面滚动）；

添加分组的步骤：

①选中“自定义列表组”控件后，单击右上角三角形（或者单击“添加分组”按钮），添加分组；

②选中每组，在右边属性中，会出现对应的分组属性，可设置是否默认间距，是否显示分组头等；

③分组后，每组类似于一个小窗体面板，可自动拉大/缩小空间，然后每组可根据实际的业务需求添加需要的控件，各控件的使用和空白窗体添加控件时使用的约束一样。

示例：

   

（布局效果）                          （预览效果）

1.5 页签栏

页签栏用于切换两个或两个以上新的空间来标记、展示和定位目标的内容（页签标题为静态添加）。

工具栏属性：

控件名称：JGMNavControlContainer

显示位置：设置页签显示的位置，有Top/Left/Right/Bottom；

子页签：主要对页签控件的子页签进行上移/下移/添加/移除的管理；

页签头显示方式：指页签头默认显示的状态，可设置为显示/隐藏；

页签图片来源：指修饰每个页签的图标，可设置为图片/图标，其中图片获取的是资管管理的图片，图标指系统的图标；

页签分割线：指两个页签之间的分割图片（只有显示位置为Top/Bottom时才起作用）；

事件：页签切换事件；

选择图标：设置子页签的图标；

高亮图标：设置当前选中子页签的对应图标（若未设置高亮图标，那么选中的图标默认为原始的选择图标）；

单击可激活页签切换：

添加选项卡的步骤：

①选中“页签栏”控件后，通过两种方法可以添加子页签：

第一种：单击右上角三角形，添加/移除/左移/右移选项卡；

第二种：在【子页签】属性中，打开子页签编辑器，进行添加/移除/上移/下移子页签的操作；

②切换对应的子页签（选项卡），然后单击子页签对应下面的空白区域，可对子页签图标，是否单击可激活页签切换等进行编辑，；

③添加页签后，每个页签下类似于一个小窗体面板，可根据实际的业务需求添加需要的控件，各控件的使用和空白窗体添加控件时使用的约束一样。

示例：

（布局效果）

（预览效果）

1.6 标签

显示标签的控件，可以根据需要选择需要的标签的样式。

工具栏属性：

控件名称：JGMLabel

标题：可定义控件的标题名称；

背景色：设置控件的背景颜色；

文本颜色：设置控件文本的字体颜色；

标题字体：可定义标题字体的样式；

对齐方式：设置标题字体的对其方式，有居中/居左/居右；

上/左边距：设置控件与父容器上/左边的间距；

显示：有，可设置为True/False；

绑定数据：可设置为True/False（注，当没有绑定实体数据时，如果为True，则显示空白，如果为False，则显示标题数据）；

自动尺寸：根据内容多少，自动拉伸控件宽度（注，只有锚定布局，该属性才起左右）。

事件：点击事件

数据设置：

①实体名：绑定实体，即对应的实体编码

②字段：设置需要绑定的字段

示例：略。

1.7 动态页签栏

动态页签栏，用于切换两个或两个以上新的空间来标记、展示和定位目标的内容。

注，一般单独用于一个面板中，页签标题可动态添加。

工具栏属性：

控件名称：JGMNavWindowContainer

显示位置：设置页签显示的位置，有Top/Left/Right/Bottom；

数据：

①窗体参数：设置动态页签栏绑定的实体数据（必须添加），或者静态数据；

添加选项卡的步骤：

①窗体参数有两种类型：动态页是必须添加，静态页根据实际场景设置（动态页不可进行：添加、删除和移动操作）；

②添加“动态页”，需要配置数据来源，定义表/实体（字段名称可自定义），选择对应的数据字段；

③如果添加“静态页”直接输入对应的数据即可；

④“被打开窗体接受参数”设置，与“打开窗体并返回数据”规则中的使用方式一致（这里将省略）；

示例：

①添加实体，并添加实体数据（注，实体数据图标只能选择系统的图标名称，实体中的必填字段有：标题、构件编码、窗体编码、图标）

②设置窗体参数；

③预览效果；

 

(预览效果)

1.8 导航栏

导航栏是位于APP页面顶部或者底部的具有固定高度的容器控件。

在V移动版里，工具栏始终只占一行，它里面的控件不能设置宽度比例，它里面的控件宽度是按照内容拉伸或是适应于父容器，它可以批量设置内部控件的布局间距。

工具栏属性：

控件名称：JGMToolStrip

泊靠：分为两种形式（Top和Bottom），设置成Top时，工具栏在APP页面的顶部显示，当设置成Bottom时，工具栏在APP页面的底部显示；

边框颜色：设置控件的边框颜色；

背景色：设置控件的背景颜色；

背景图片：选择资源管理器中的图片，作为控件背景使用；

固定：True/False，True表示导航栏控件固定占位，False表示导航栏控件浮动在界面上，某种场景会把下面的控件遮住。

示例：

（布局效果）

（预览效果）

1.9 图标

图标控件主要是为了满足某些业务场景需求，作为图标使用，例如点赞/收藏的功能，其中区别于按钮控件的属性是可进行数据的绑定。

工具栏属性：

控件名称：JGMIcon

上/左边距：设置控件与父容器上/左边的间距；

背景色：设置控件的背景颜色；

前景色：设置控件文本的字体颜色；

边框样式/宽度/颜色：分别设置按钮控件的边框的样式、宽度，以及颜色；

圆角半径：根据按钮控件的选择的形状（圆形/矩形），进行半径大小的设置；

使能/显示：有，可设置为True/False；

事件：点击按钮事件；

图标：可选择系统图标修饰按钮，选择图标后可设置图标的位置；

数据设置：

①实体名：绑定实体，即对应的实体编码

②字段名称：设置需要绑定的字段

示例：略。

1.10 浮层按钮

浮层按钮主要是为了满足某些业务场景需求，当点击按钮时，显示子浮层面板，再点击按钮时隐藏浮层，在浮层中可以自定义布局。

工具栏属性：

控件名称：JGMLayerButton

标题：可定义浮层按钮控件的标题名称；

上/左边距：设置控件与父容器上/左边的间距；

背景色：设置控件的背景颜色；

前景色：设置控件文本的字体颜色；

浮层位置：设置当激活浮层按钮后，子浮层面板的出现位置，包括：自动（默认属性）、上（在浮层按钮的上方显示子浮层面板）和下（在浮层按钮的下方显示子浮层面板）；

边框样式/宽度/颜色：分别设置按钮控件的边框的样式、宽度，以及颜色；

圆角半径：根据按钮控件的选择的形状（圆形/矩形），进行半径大小的设置；

使能/显示：有，可设置为True/False；

事件：点击按钮事件；

图标：可选择系统图标修饰按钮，选择图标后可设置图标的位置；

激活状态图标：指点击“浮层按钮”后，打开“字符层面板”状态时，对应的显示图标；

子浮层面板属性：

控件名称：JGMFlowLayer

相对距离：设置子浮层面板与浮层按钮之间的相对距离；

上/左边距：设置控件与父容器上/左边的间距；

背景色：设置控件的背景颜色；

边框样式/宽度/颜色：分别设置按钮控件的边框的样式、宽度，以及颜色；

圆角半径：根据按钮控件的选择的形状（圆形/矩形），进行半径大小的设置；

水平对齐：可设置子浮层面板相对浮层按钮的对齐方式，包括：随页面拉伸/左对齐按钮/右对齐按钮；

箭头方向/偏移/大小：设置子浮层面板的箭头对准浮层按钮的方向、偏移多少和大小；

入场动画/出场动画：设置浮层面板的出现时的效果动画和退出时的效果动画；

事件：激活事件/未激活事件；

示例：

（布局效果）

（预览效果）

1.11 面板

面板控件主要用于某些布局场景，例如在一个页面中的布局，分为几个单独的模块，可以重叠/不重叠，那么可以通过面板控件进行某些模块的布局控制。

工具栏属性：

控件名称：JGMSuperPanel

上/左边距：设置控件与父容器上/左边的间距；

背景色：设置控件的背景颜色；

边框样式/宽度/颜色：分别设置按钮控件的边框的样式、宽度，以及颜色；

圆角半径：根据按钮控件的选择的形状（圆形/矩形），进行半径大小的设置；

入场动画/出场动画：设置面板的出现时的效果动画和退出时的效果动画；

显示：有，可设置为True/False；

示例：如下图

在该示例中，即可满足一个页面中存在多种布局方式：

面板1：里面控件垂直组合

面板2：里面控件水平组合

其中，组合后，在层级树种会生成JGMPanel面板（注意区别：组合后的面板和工具栏中的面板）

面板3：里面控件锚定布局

（布局效果）

1.12 图片画廊

图片画廊主要是显示图片的一种布局模式，可设置每行显示多少张图片和是否显示图片名称等。

工具栏属性：

控件名称：JGMImgGalleries

显示风格：可设置图片的显示模式，有：normal（普通）/ float（浮层标题）/ container（容器边框）

显示列数：设置图片画廊一行显示多少张图片；

标题布局：设置标题的对其方式，有：center（居中）/left（居左）/right（居右）

数据类型：支持两种数据类型模式，分别是：static（静态配置）/dync（动态实体）

静态图片集：设置图片画廊的图片来源（注：只有当数据类型为静态配置时，才有效）；

标题字体：可定义图片标题字体的样式；

描述字体：可定义图片描述字体的样式；

图片位置：可设置为适应/填充；

上/左边距：设置控件与父容器上/左边的间距；

模式：可设置为默认/可编辑/单选/多选（注：只有当数据类型为动态实体时，才有效）；

图片形状：可设置正方形/原型/自定义（注：自定义形状，可设置是否自动图片高度）；

图片边框宽度/颜色：分别设置图片的宽度/颜色；

图片内间距：设置图片与单元格之间的距离；

单元间距：设置单元格与单元格之间的距离；

图片圆角半径：设置图片形状的半径（注：只有正方形和自定义形状才可以使用）；

事件：单击事件

数据设置（注：只有当数据类型为动态实体时，才有效）：

①实体名：绑定实体，即对应的实体编码

②图片字段：设置在图片上传时，对应的文件标识字段

③图片标题：绑定图片标题的字段

④图片描述：绑定图片描述的字段

示例：

（布局效果）

（预览效果）

1.13 多行文本

多行文本主要是用于显示多行文字内容的场景。

工具栏属性：

 

控件名称：MMultilineText

标题：可定义多行文本控件的标题名称；

背景颜色：设置控件的背景颜色；

前景颜色：设置控件文本的字体颜色；

上/左边距：设置控件与父容器上/左边的间距；

标签字体：设置多行文本控件的字体样式；

边框样式/宽度/颜色：分别设置按钮控件的边框的样式、宽度，以及颜色；

圆角半径：根据按钮控件的选择的形状（圆形/矩形），进行半径大小的设置；

垂直布局：可设置成上/中/下；

水平布局：可设置成左/中/右；

自动高度：如果设置为true，将不设置控件的高度，让其根据内容伸展，此时行数属性不可用；

行数：设置多行文本控件显示的行数，此时自动高度必须设置为false；

使能/显示/：有，可设置为True/False；

事件：点击按钮事件；

示例：

（预览效果）

1.14 按钮组

按钮组控件主要用于当绑定实体的某个字段时，以按钮的模式展示数据，可点击触发对应的事件。

工具栏属性：

控件名称：JGMButtonGroup

背景颜色：设置控件按钮的背景颜色；

文本景色：设置控件按钮的字体颜色；

选中背景色：设置控件选中按钮的背景颜色；

选中文本色：设置控件选中按钮的字体颜色；

上/左边距：设置控件与父容器上/左边的间距；

使能/显示：有，可设置为True/False；

事件：点击事件；

数据设置：

①实体名：绑定实体，即对应的实体编码

②显示字段：设置需要显示的字段

③标识字段：设置作为标识的字段

④数据来源：自定义/前台实体

示例：

（布局效果）

数据来源为“自定义”时，如下：

数据来源为“前台实体”时，如下：

前台实体的数据，如下：

部署并预览移动端效果：

 

（预览效果）

1.15 按钮式弹出菜单

按钮式弹出菜单主要用于多级菜单设置，用户可以设置添加菜单项，并只能显示一级菜单。

工具栏属性：

控件名称：JGMDropDownButton

标题：可定义控件的标题名称；

按钮图标：可选择系统图标修饰按钮；

按钮背景色：设置控件按钮的背景颜色；

按钮前景色：设置控件按钮的字体颜色；

选项背景色：设置控件选项的背景颜色；

选项前景色：设置控件选项的字体颜色；

上/左边距：设置控件与父容器上/左边的间距；

菜单设计：设置菜单的数据来源（注：只有当数据类型为静态配置时，才有效）；

数据类型：支持两种数据类型，分别是：statictype（静态配置）/dynctype（动态配置）；

（注，当值为静态配置时，绑定实体失效；当值为动态配置时，菜单设计失效。）

数据设置：

①实体名：绑定实体，即对应的实体编码

示例：

①当数据类型为“静态配置”时，如下：

需要配置“菜单设计”，即只有数据类型为“静态配置”，该属性“菜单设计”设置才生效，如下图：

②当数据源类型为“动态配置”时，需要配置菜单实体数据源，请参考菜单实体的字段配置说明：

在配置菜单实体数据时，注：菜单实体数据中，必须存在一个父菜单，并且不会在使用时加载出来，那么再添加菜单时，需要获取父菜单的id编码，作为新增菜单的父编码。

在本示例中，配置了“菜单实体数据”的添加界面（在实际业务中，可根据需求调整配置界面和规则，只要菜单实体的字段数据符合要求即可），数据如下：

当数据源类型为“动态配置”，需要绑定实体，如下：

部署并预览移动端效果：

（预览效果1）

（预览效果2）

1.16 富文本浏览

用于显示含格式的、较长的文本。

工具栏属性：

控件名称：JGMRichTextViewer

上/左边距：设置控件与父容器上/左边的间距；

背景色：设置控件的背景颜色；

边框样式/宽度/颜色：分别设置按钮控件的边框的样式、宽度，以及颜色；

事件：值加载事件

数据设置：

①实体名：绑定实体，即对应的实体编码

②字段名称：设置需要绑定的字段

示例：

（布局效果）

 

 

（预览效果）

1.17 滑块

滑块控件主要是针对调整数值大小的控件，特别是音量样式的调整。

工具栏属性：

控件名称：JGMSlider

滑块类型：设置滑块的样式类型（普通样式和音量样式）；

上/左边距：设置控件与父容器上/左边的间距；

标题：可定义滑块控件的标题名称；

是否显示标题：设置标题是否显示，可设置为True/False；

是否显示输入框：设置输入框是否显示，可设置为True/False（只有滑块类型为普通样式才生效）；

输入框是否为只读：设置输入框是否可读，可设置为True/False（只有滑块类型为普通样式才生效）；

是否显示数字提示框：设置在滑动滑块时，上面是否显示对应的数字提示，可设置为True/False（只有滑块类型为普通样式才生效）；注，该属性必须在控件布局前存在其他控件，或者设置一定的上边距，才可以预览显示的提示数字。

最大值/最小值：可设置滑块的最小值和最大值；

显示/使能：有，可设置为True/False；

数据设置：

①实体名：绑定实体，即对应的实体编码

②字段名称：设置需要绑定的字段

示例：

1.18 图片浏览器

图片浏览器主要用于浏览图片，一般单独使用于一个页面中，可设置图片对应的名称和详细内容等。

工具栏属性：

控件名称：JGMPicBrowse

图片来源类型：支持两种图片来源类型，分别是：Control（静态配置）/Table（动态生成）

选择图片（注：只有当数据类型为Control时，才有效）：选择资管管理器中对应的图片，并且编辑图片描述；

上/左边距：设置控件与父容器上/左边的间距；

事件：点击事件

数据设置（注：只有当数据类型为动态生成时，才有效）：

①实体名：绑定实体，即对应的实体编码

②图片名称：设置图片的名称字段

③图片描述：设置图片的描述字段

示例：

（布局效果）

（预览效果）

1.19 验证码

验证码控件一般用于登录/注册场景，发送短信验证号码。

注：该控件目前需要自己开发二次规则结合使用。

工具栏属性：

控件名称：JGMVerificationCode

标题：可定义验证码控件的标题名称；

标题图标：设置标题的显示图标；

标题宽度：设置标题在整个控件宽度中的比例；

提醒文字：设置验证码控件输入时的提醒文字；

右置按钮标题：设置验证码控件右边的显示文字；

上/左边距：设置控件与父容器上/左边的间距；

按钮前景色：设置验证码控件的前景色；

按钮边框颜色：设置验证码控件的边框颜色；

按钮背景色：设置验证码控件的背景色；

显示/显示标签/自动发送验证码：可设置true/false；

秒数间隔：可设置验证码发送的间隔数；

数据设置：

①实体名：绑定实体，即对应的实体编码

②字段：设置需要绑定的字段

示例：略。

1.20 组件容器

组件容器控件主要用于页面的装载，主要结合“打开窗体并返回数据”规则使用，以组件容器的方式打开指定窗体。

工具栏属性：

控件名称：JGMComponentContaine

显示：有（默认均为True）

示例：

（布局效果）

（预览效果）

1.21 线条

线条控件一般是在页面中，作为分隔线使用。

工具栏属性：

控件名称：JGMLine

类型：设置线条的样式类型（水平/垂直）；

上/左边距：设置控件与父容器上/左边的间距；

标题：可定义线条控件的标题名称；

边框样式/颜色：分别设置按钮控件的边框的样式和颜色；

示例：

1.22 自定义Div

提供自定义Div，允许用户自行定义Html/JavaScript/Css，用户可以根据实际的业务需求通过编辑html代码，生成对应的按钮、文本、标签控件等，并绑定对应的实体和添加相关的事件，如下：

工具栏属性：

控件名称：JGMDiv1

高度/宽度：设置控件的高度和宽度大小，注若设置了自动高度，那么高度属性中设置的值不生效；

上/左边距：设置控件与父容器上/左边的间距；

锚定：主要设置控件与父容器之间的相对位置，若组合布局，该属性不生效；

自动高度：指自定义Div控件可根据定义内容的大小，控件高度自动调整，注该属性只有组合后才生效；

显示：有，可设置为True/False。

示例：略

1.23 倒计时

倒计时控件，主要用于在页面中设置了截止日期，然后进行倒计时使用。

工具栏属性：

 

控件名称：JGMCountDown2

高度：设置倒计时控件的高度；

标题字体/颜色：可定义倒计时控件的标题字体样式、大小和颜色；

标题图标/图标大小/图标颜色：可定义倒计时控件的标题图标、图标大小和图标颜色；

右边注释文字：主要针对倒计时控件右边需要添加注释文字时，进行文字的编辑，其样式与标题一致；

截止时间：当前时间和截止时间的时间差，就是倒计时的时间；

时间字体/颜色/背景色：设置时间的字体样式、字体颜色和背景颜色；

时间内间距：设置控件中时间内部的上/下/左/右边的间距；

自定义单位：可重命名时间的单位；

限制单位：指显示的时间单位单位；

单位字体/颜色：主要设置时间单位的字体样式和字体颜色；

单位垂直对齐：主要指时间单位与时间的对齐方式，可设置为上/中/下，默认为下；

 

 

外部间距：设置控件与父容器上/下/左/右边的间距；

显示：有，可设置为True/False。

示例：

①默认样式

②时间范围+空标题

③重置单位+标题+注释

④单位字体大小+字体颜色

⑤单位字体大小+字体颜色+背景色