new FormPane(json)
表单面板组件
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
json |
any |
<optional> |
Requires:
- module:ht-form.js
Requires
- module:ht-form.js
Methods
-
addPropertyChangeListener(listener, scope, ahead) → {void}
-
增加自身属性变化事件监听器
Parameters:
Name Type Attributes Description listener
function 监听器函数
scope
Object <optional>
监听器函数域
ahead
boolean <optional>
是否将当前监听器插入到监听器列表开头
Returns:
void- See:
-
addRow(items, widths, height, params) → {void}
-
添加一行组件
Parameters:
Name Type Attributes Description items
any 元素数组,元素可为字符串、json格式描述的组件参数信息、html元素或者为null的空
widths
Array.<any> | Array.<number> 每个元素宽度信息数组,宽度值大于1代表固定绝对值,小于等于1代表相对值,也可为80+0.3的组合
height
string | number <optional>
行高信息,值大于1代表固定绝对值,小于等于1代表相对值,也可为80+0.3的组合,为空时采用默认行高
params
Object <optional>
json格式的额外参数,例如插入行索引以及行边框或背景颜色等,如{index: 2, background: 'yellow', borderColor: 'red'}
Returns:
void -
addToDOM(parentNode) → {void}
-
将组件加入到指定的 DOM 元素底下,不指定则加入到 document.body 下
Parameters:
Name Type Attributes Description parentNode
HTMLElement <optional>
父 DOM,默认为 document.body
Returns:
void -
addViewListener(listener, scope, ahead) → {void}
-
监听视图事件,如布局、刷新等
Parameters:
Name Type Attributes Description listener
function 监听器函数
scope
Object <optional>
监听器函数域
ahead
boolean <optional>
是否将当前监听器插入到监听器列表开头
Returns:
void -
adjustTranslateX(value) → {number}
-
传入即将设置的水平平移值,返回最终设置值,可重载限制水平平移范围
Parameters:
Name Type Description value
number 原始水平平移值
Returns:
number -新的水平平移值
-
adjustTranslateY(value) → {number}
-
传入即将设置的垂直平移值,返回最终设置值,可重载限制垂直平移范围
Parameters:
Name Type Description value
number 原始垂直平移值
Returns:
number -新的垂直平移值
-
clear() → {void}
-
清除所有组件
Returns:
void -
firePropertyChange(property, oldValue, newValue, equalFunc, params) → {void}
-
派发属性变化事件,可使用fp的简写方式
Parameters:
Name Type Attributes Description property
string 属性
oldValue
any 旧值
newValue
any 新值
equalFunc
function <optional>
相等判断函数
params
any <optional>
其它参数
Returns:
void -
fireViewEvent(kind) → {void}
-
Parameters:
Name Type Description kind
string Returns:
void -
fp(property, oldValue, newValue, equalFunc, params) → {void}
-
派发属性变化事件,firePropertyChange 方法的简写
Parameters:
Name Type Attributes Description property
string 属性
oldValue
any 旧值
newValue
any 新值
equalFunc
function <optional>
相等判断函数
params
any <optional>
其它参数
Returns:
void -
getClass() → {function}
-
获取类声明(构造函数)
Returns:
function -类声明(构造函数)
-
getClassName() → {string}
-
获取类全名
Returns:
string -类全名
-
getDisabledDiv() → {HTMLElement}
-
获取被禁用组件的div
Returns:
HTMLElement -被禁用组件的div
-
getHeight() → {number}
-
获取布局高度
Returns:
number -布局高度
-
getHGap() → {number}
-
获取表单的行垂直间距,默认值为6
Returns:
number -表单的行垂直间距
-
getHPadding() → {number}
-
获取表单左边和右边与组件内容的间距,默认值为 8
Returns:
number -表单左边和右边与组件内容的间距
-
getItemBackground(item) → {string}
-
获取 item 背景颜色
Parameters:
Name Type Description item
Object Returns:
string -item 背景颜色
-
getItemBorderColor(item) → {string}
-
获取 item 边框颜色
Parameters:
Name Type Description item
Object Returns:
string -item 边框颜色
-
getItemById(id) → {any}
-
根据id值找到对应的item元素
Parameters:
Name Type Description id
string id值
Returns:
any -item元素
-
getItemView(item) → {HTMLElement}
-
获取指定表单项 DOM 节点
Parameters:
Name Type Description item
Object 表单项
Returns:
HTMLElement -DOM 节点
-
getLabelAlign(item) → {string}
-
获取指定表单项文本对齐方式
Parameters:
Name Type Description item
Object 表单项
Returns:
string -对齐方式
-
getLabelColor(item) → {string}
-
获取指定表单项文本颜色
Parameters:
Name Type Description item
Object 表单项
Returns:
string -颜色
-
getLabelFont() → {string}
-
获取文本字体
Returns:
string -文本字体
-
getLabelHPadding() → {number}
-
获取文本水平内间距
Returns:
number -内间距
-
getLabelVAlign() → {string}
-
获取文字垂直对齐方式
Returns:
string -
getLabelVPadding() → {number}
-
获取文本垂直内间距
Returns:
number -内间距
-
getLogicalPoint(event) → {Object}
-
传入HTML事件对象,将事件坐标转换为组件中的逻辑坐标
Parameters:
Name Type Description event
Event 事件对象
Returns:
Object -逻辑坐标
-
getRowBackground(item) → {string}
-
获取指定表单项背景颜色
Parameters:
Name Type Description item
Object 表单项
Returns:
string -颜色
-
getRowBorderColor(item) → {string}
-
获取指定表单项边框颜色
Parameters:
Name Type Description item
Object 表单项
Returns:
string -颜色
-
getRowHeight() → {number}
-
获取行高
Returns:
number -行高
-
getRows() → {Array.<any>}
-
获取表单所有行
Returns:
Array.<any> -
getScrollBarColor() → {string}
-
获取滚动条颜色
Returns:
string -颜色
-
getScrollBarSize() → {number}
-
获取滚动条宽度
Returns:
number -滚动条宽度
-
getScrollHeight() → {number}
-
获取表单可滚动高度
Returns:
number -可滚动高度高度
-
getScrollWidth() → {number}
-
获取表单可滚动宽度
Returns:
number -可滚动高度宽度
-
getSuperClass() → {function}
-
获取父类声明(构造函数)
Returns:
function -父类声明(构造函数)
-
getTranslateX() → {number}
-
获取水平平移值
Returns:
number -水平平移值
-
getTranslateY() → {number}
-
获取垂直平移值
Returns:
number -垂直平移值
-
getValue(id) → {any}
-
根据 id 获取对应 item 元素值
Parameters:
Name Type Description id
string Returns:
any -对应 item 元素值
-
getVGap() → {number}
-
获取表单组件垂直间距,默认值为6
Returns:
number -垂直间距
-
getView() → {HTMLDivElement}
-
获取组件的根层div
Returns:
HTMLDivElement -
getViewById(id) → {any}
-
根据 id 获取对应 item
Parameters:
Name Type Description id
string Returns:
any -对应 item
-
getVPadding() → {number}
-
获取表单顶部和顶部与组件内容的间距,默认值为8
Returns:
number -垂直内边距
-
getWidth() → {number}
-
获取布局宽度
Returns:
number -布局宽度
-
invalidate(delay) → {void}
-
无效组件,并调用延时刷新
Parameters:
Name Type Attributes Description delay
number <optional>
延迟刷新的间隔事件(单位:ms)
Returns:
void- See:
-
isAutoHideScrollBar() → {boolean}
-
是否自动隐藏滚动条
Returns:
boolean -
isDisabled() → {boolean}
-
组件是否处于不可用状态,处于此状态时不能进行任何操作并且会遮挡一层蒙板
Returns:
boolean -
iv(delay) → {void}
-
无效组件,并调用延时刷新
Parameters:
Name Type Attributes Description delay
number <optional>
延迟刷新的间隔事件(单位:ms)
Returns:
void- See:
-
layout(x, y, width, height) → {void}
-
执行布局
Parameters:
Name Type Description x
number 视图左上角布局 x 点位置
y
number 视图左上角布局 y 点位置
width
number 视图宽度
height
number 视图高度
Returns:
void -
lp(event) → {Object}
-
传入HTML事件对象,将事件坐标转换为组件中的逻辑坐标,getLogicalPoint的缩写
Parameters:
Name Type Description event
Event 事件对象
Returns:
Object- See:
-
mp(listener, scope, ahead) → {void}
-
增加自身属性变化事件监听器,addPropertyChangeListener 的缩写
Parameters:
Name Type Attributes Description listener
function 监听器函数
scope
any <optional>
监听器函数域
ahead
boolean <optional>
是否将当前监听器插入到监听器列表开头
Returns:
void -
onPropertyChanged(event) → {void}
-
属性变化回调函数,可重载做后续处理
Parameters:
Name Type Description event
Object 属性变化事件
Returns:
voidExample
//event格式: { property: 'name',//发生变化的属性 oldValue: 'oldValue',//旧值 newValue: 'newValue',''新值 data: data//发生变化的data }
-
onTranslateEnded() → {void}
-
平移动画结束时回调,可重载做后续处理
Returns:
void -
removePropertyChangeListener(listener, scope) → {void}
-
删除自身属性变化事件监听器
Parameters:
Name Type Attributes Description listener
function 监听器函数
scope
Object <optional>
监听器函数域
Returns:
void -
removeRow(index) → {void}
-
删除指定行
Parameters:
Name Type Description index
number 行号
Returns:
void -
removeRows(items) → {void}
-
批量删除行
Parameters:
Name Type Description items
Array.<any> 行号
Returns:
void -
removeViewListener(listener, scope) → {void}
-
删除视图事件监听器
Parameters:
Name Type Attributes Description listener
function 监听器函数
scope
Object <optional>
监听器函数域
Returns:
void -
setAutoHideScrollBar(v) → {void}
-
设置是否自动隐藏滚动条,默认为true
Parameters:
Name Type Description v
boolean 是否自动隐藏滚动条
Returns:
void -
setCursor(style) → {void}
-
设置 css 的鼠标样式,cursor
Parameters:
Name Type Description style
string css 的鼠标样式
Returns:
void -
setDisabled(value, iconUrl) → {void}
-
设置组件是否处于不可用状态,处于不可用状态时不能进行任何操作并且会遮挡一层蒙板
Parameters:
Name Type Attributes Description value
boolean 是否禁用组件
iconUrl
string <optional>
蒙板上显示的icon的路径
Returns:
void -
setHeight(height) → {void}
-
设置布局高度
Parameters:
Name Type Description height
number 高度值
Returns:
void -
setHGap(hGap) → {void}
-
设置表单的行水平间距,默认值为 6
Parameters:
Name Type Description hGap
number 行水平间距
Returns:
void -
setHPadding(hPadding) → {void}
-
设置表单左边和右边与组件内容的间距,默认值为 8
Parameters:
Name Type Description hPadding
number 间距
Returns:
void -
setLabelAlign(align) → {void}
-
设置表单文本对齐方式
Parameters:
Name Type Description align
string 对齐方式
Returns:
void -
setLabelColor(color) → {void}
-
设置表单文本颜色
Parameters:
Name Type Description color
string 颜色
Returns:
void -
setLabelFont(font) → {void}
-
设置表单文本字体
Parameters:
Name Type Description font
string 字体
Returns:
void -
setLabelHPadding(hPadding) → {void}
-
设置表单文本左边和右边与组件内容的间距,默认值为 8
Parameters:
Name Type Description hPadding
number 间距
Returns:
void -
setLabelVAlign(align) → {void}
-
设置表单文本垂直对齐方式
Parameters:
Name Type Description align
string 垂直对齐方式
Returns:
void -
setLabelVPadding(vPadding) → {void}
-
设置文字顶部和顶部的间距,默认值为 0
Parameters:
Name Type Description vPadding
number 间距
Returns:
void -
setPadding(padding) → {void}
-
- 设置内边距
Parameters:
Name Type Description padding
number 间距
Returns:
void -
setRowHeight(height) → {void}
-
设置默认行高
Parameters:
Name Type Description height
number 行高
Returns:
void -
setScrollBarColor(color) → {void}
-
设置滚动条颜色
Parameters:
Name Type Description color
string 颜色值
Returns:
void -
setScrollBarSize(size) → {void}
-
设置滚动条宽度
Parameters:
Name Type Description size
number 宽度值
Returns:
void -
setTranslate(x, y, anim) → {void}
-
设置垂直平移值(水平平移值无效)
Parameters:
Name Type Attributes Description x
number 水平平移值,此参数无效
y
number 垂直平移值
anim
boolean | Object <optional>
默认false,是否使用动画,可以设置为 true 或者 false 或者 animation 动画对象
Returns:
void -
setTranslateX(x) → {void}
-
设置拓扑水平平移值
Parameters:
Name Type Description x
number 水平平移值
Returns:
void -
setTranslateY(y) → {void}
-
设置拓扑垂直平移值
Parameters:
Name Type Description y
number 垂直平移值
Returns:
void -
setValue(id, value) → {void}
-
根据 id 设置对应 item 元素值
Parameters:
Name Type Description id
string 需修改 item 的 id
value
any 值
Returns:
void -
setVGap(vGap) → {void}
-
设置表单组件垂直间距,默认值为 6
Parameters:
Name Type Description vGap
number 行垂直间距
Returns:
void -
setVPadding(vPadding) → {void}
-
设置表单顶部和顶部与组件内容的间距,默认值为 8
Parameters:
Name Type Description vPadding
number 垂直内间距
Returns:
void -
setWidth(width) → {void}
-
设置布局宽度
Parameters:
Name Type Description width
number 宽度值
Returns:
void -
translate(x, y, anim) → {void}
-
在当前值基础上增加垂直平移值(水平无效)
Parameters:
Name Type Attributes Description x
number 新增的水平平移值,此参数无效
y
number 新增的垂直平移值
anim
boolean | Object <optional>
是否使用动画,可以是动画对象
Returns:
void -
tx(value) → {number}
-
获取或设置水平平移值,没有参数时相当于getTranslateX,有参数时相当于setTranslateX
Parameters:
Name Type Attributes Description value
number <optional>
Returns:
number -水平平移值
- See:
-
- -
-
ty(value) → {number}
-
获取或设置垂直平移值,没有参数时相当于getTranslateY,有参数时相当于setTranslateY
Parameters:
Name Type Attributes Description value
number <optional>
Returns:
number -垂直平移值
- See:
-
- -
-
ump(listener, scope) → {void}
-
删除自身属性变化事件监听器,removePropertyChangeListener的缩写
Parameters:
Name Type Attributes Description listener
function 监听器函数
scope
Object <optional>
监听器函数域
Returns:
void -
updateItemElement(id, dom) → {void}
-
根据 id 更新 dom 节点
Parameters:
Name Type Description id
string dom
HTMLDivElement 更新 dom 节点
Returns:
void -
v(id, value) → {string}
-
根据id获取或设置对应item元素值
1、一个参数:
当参数为 string 时相当于 getValue;
当参数为 Object 时,则会遍历该 Object 中的属性,逐个调用 setValue 设置item元素值;
2、两个参数:
相当于 setValueParameters:
Name Type Attributes Description id
string | Object id 值
value
any <optional>
属性值
Returns:
string -对应 item 元素值
-
validate() → {void}
-
立刻刷新拓扑
Returns:
void -
validateImpl() → {void}
-
刷新
Returns:
void