Skip to end of metadata
Go to start of metadata

简介

AutoForm是一种自动表单,是AutoFormElement的一个集合,内部可以定义多个AutoFormElement:

并且按照ForeLayout的布局形式展现:

其布局特性是FormLayout类似的,如下图的FormLayout:

你可以通过cols属性设定一行可以分几列,其中有可进一步设置每一个AutoFormElement的colSpan和rowSpan属性,使部分AutoFormElement可以实现跨行和跨列布局的特性。

详细属性说明

autoCreateElements

是否自动根据绑定的EntityDataType自动创建其中的表单元素。所谓绑定的EntityDataType是指:

  • 由AutoForm的dataType属性所指定的EntityDataType
  • 如果没有设定dataType属性,则由dataSet和dataPath属性计算后所对应的DataPath
如果未在AutoForm中定义任何AutoFormElement子对象,但是设置了其autoCreateElements属性为true:

通过以上规则计算得到的EntityDataType为ProductType,那么它就会自动的根据ProductType中的ProertyDef自动创建内部的AutoFormElement对象:

colPadding

表单列之间的留白大小。像素值。

这是colPadding为6的效果图:

这是colPadding为60的效果图:


cols

表单布局的分栏方式。

该属性决定了表单如何分栏,简单的写法有:

表示一个分四列,其中数字表示每一列的宽度。

 

其中列的宽度既可以使用像素值,也可以使用'*'表示中充满剩余宽度。下面用这种方式定义cols:

其中第二列设置为'*',运行效果如下:

 

定义分栏方式的基本格式为:列1的宽度[列1的ClassName],列2的宽度[列2的ClassName],.....

 

列的ClassName不是必须给定的信息,可以省略。如果要省略某列的ClassName,请注意一同省略'['和']'。

例如cols配置为:

CSS设置: 

 

运行效果:
可以看到第一列的标题为红色,而第二列的标题为蓝色。

createOwnEntity

是否要自动创建一个私有的Entity,否则AutoForm将尝试使用关联的FormProfile中的Entity。

此属性在createPrivateDataSet为true时或AutoForm绑定DataSet时将失去意义。

TODO: UML说明

createPrivateDataSet

是否要在AutoForm没有实际绑定DataSet时自动创建一个私有的DataSet用于管理表单数据。

由于Dorado中有很多类似于数据校验、键值映射这样的功能都依赖于DataSet,所以如果仅仅使用简单的Entity绑定,AutoForm必然是失去一些功能特性。 启用本属性可以让AutoForm自动创建一个私有的DataSet,以便于使用上述各项功能。

对于createPrivateDataSet为true的AutoForm必须设置dataType属性,因为在创建私有DataSet的时候必须指定DataType属性。

对于createPrivateDataSet为true的AutoForm,如果我们通过如下代码获取Entity对象,则它是被这个私有的DataSet所管理的实体对象。

dataPath,dataSet

参考:DataControl(DCUG)AutoForm通过这两个属性的配置,使之绑定到DataSet的一个Entity对象上

dataType

dataType一般情况下不用定义,会自动根据AutoForm的dataSet和dataPath计算出来。

dataType通常的作用有:

  • autoCreateElements属性为true时,需要获取dataType,并自动生成内部的AutoFormElement对象
  • 当AutoForm未绑定DataSet,且设置了createPrivateDataSet为true,则AutoForm内部创建私有DataSet的时候需要获取dataType配置

entity

AutoForm内部的私有数据对象。

  • 如果AutoForm绑定了DataSet(含createPrivateDataSet为true的情况),则这个Entity对象就是根据AutoForm的dataSet和dataPath所计算出的Entity对象
  • 如果AutoForm未绑定DataSet,但是AutoForm配置了formProfile,则这个entity对象就是FormProfile内部存储的Entity对象
  • 如果AutoForm未绑定DataSet,并且AutoForm未配置formProfile,则是自己私有的Entity对象
根据Dorado数据模型编程的特点,如果我们希望访问AutoForm中的数据,则可以直接访问其内部的Entity对象:
情况一:AutoForm绑定了DataSet(含createPrivateDataSet为true的情况)-Entity方式访问:

 

情况二:AutoForm未绑定DataSet-JSON方式访问:

 

editorWidth

用于统一设置内部AutoFormElement的文本编辑框的宽度

formProfile

同:FormElement(DCUG)#formProfile

hintPosition,hintSpacing,hintWidth,showHintMessage

用于统一设置内部AutoFormElement的相关提示信息的属性,详情请参考:FormElement(DCUG)

labelAlign, labelPosition, labelSeparator, labelSpacing,labelWidth,showLabel

用于统一设置内部AutoFormElement的相关文本标签的属性,详情请参考:FormElement(DCUG)

rowHeight

默认的行高22,效果如下:

行高改为42,效果如下:


rowPadding

表单行之间的留白大小。像素值。

默认rowPadding为6的效果:

默认rowPadding为1的效果:


stretchWidth

是否将表单的宽度自动扩展为撑满容器。

如下图,我们将AutoForm的stretchWidth设置为true:

我们改变IE窗口的尺寸,使之更大:

这个时候可以看到AutoForm会自适应的变宽。

当然如果将stretchWidth设置为false,就没有这种效果了:

本例是用浏览器窗口的大小说明这种自适应性,在开发中所谓的"是否将表单的宽度自动扩展为撑满容器",其中的容器及可以是浏览器窗口,也可以是Dorado当中的各种Container类型的控件。

 

技巧一:动态隐藏内部元素或显示后布局刷新问题

有时候我们动态设置AutoForm的Element元素的可见性后,AutoForm的布局会出现不太整齐的现象,如下图:

我们可以通过调整AutoForm的宽度,从而导致AutoForm自动重新计算布局并刷新解决问题,参考代码:

Labels
  • No labels