new TableView(dataModel)
表格组件,以表格的方式呈现DataModel中Data的属性
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
dataModel |
ht.DataModel |
<optional> |
Methods
-
addBottomPainter(painter) → {void}
-
增加底层Painter
组件上提供Painter接口,开发者可以使用Canvas的画笔对象自由绘制任意形状,底层Painter绘制在组件最下面Parameters:
Name Type Description painter
painter | basePainterClass 可传递绘制函数或者对象。为对象时在 draw 属性上实现绘制函数
Returns:
voidExample
//Painter示例1: function MyBottomPainter() { } ht.Default.def(MyBottomPainter, Object, { draw: function (g) { g.save(); //draw... g.restore(); } }); TableView.addBottomPainter(new MyBottomPainter()); //Painter示例2: var painter = function (g) { g.save(); //draw... g.restore(); } TableView.addBottomPainter(painter);
-
addColumns(columns) → {void}
-
以json的方式配置表格中的列(新增)
Parameters:
Name Type Description columns
Array.<Object> json列
Returns:
voidExample
//示例: tableView.addColumns([{ name: 'id', displayName: '序号' }, { name: 'background', accessType: 'style' } ]);
-
addPropertyChangeListener(listener, scope, ahead) → {void}
-
增加自身属性变化事件监听器
Parameters:
Name Type Attributes Description listener
function 监听器函数
scope
Object <optional>
监听器函数域
ahead
boolean <optional>
是否将当前监听器插入到监听器列表开头
Returns:
void -
addToDOM(parentNode) → {void}
-
将视图插入到 dom 中
Parameters:
Name Type Attributes Description parentNode
HTMLDivElement <optional>
父DOM
Returns:
void -
addTopPainter(painter) → {void}
-
增加顶层Painter
组件上提供Painter接口,开发者可以使用Canvas的画笔对象自由绘制任意形状,顶层Painter绘制在组件最上面Parameters:
Name Type Description painter
painter | basePainterClass 可传递绘制函数或者对象。为对象时在 draw 属性上实现绘制函数
Returns:
voidExample
//Painter示例1: function MyTopPainter() { } ht.Default.def(MyTopPainter, Object, { draw: function (g) { g.save(); //draw... g.restore(); } }); TableView.addTopPainter(new MyTopPainter()); //Painter示例2: var painter = function (g) { g.save(); //draw... g.restore(); } TableView.addTopPainter(painter);
-
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 -新的垂直平移值
-
disableToolTip() → {void}
-
关闭ToolTip功能
Returns:
void -
dm() → {ht.DataModel}
-
获取数据模型,没有参数时相当于getDataModel的缩写
-
drawCell(g, data, selected, column, x, y, width, height) → {void}
-
绘制单元格,可重载自定义单元格渲染,如果返回值为HTML元素,则使用HTML元素当作Renderer
Parameters:
Name Type Description g
CanvasRenderingContext2D 画笔对象
data
ht.Data 数据元素
selected
boolean 数据元素是否选中
column
ht.Property 列信息
x
number 左上角x坐标
y
number 左上角y坐标
width
number 绘制的宽度
height
number 绘制的高度
Returns:
void -HTML元素
-
drawCheckColumnCell(g, data, selected, column, x, y, width, height, view) → {void}
-
绘制check列单元格,可重载自定义
Parameters:
Name Type Description g
CanvasRenderingContext2D 画笔对象
data
ht.Data 数据元素
selected
boolean 数据元素是否选中
column
ht.Property 列信息
x
number 左上角x坐标
y
number 左上角y坐标
width
number 绘制的宽度
height
number 绘制的高度
view
ht.widget.TableView 当前的表格组件
Returns:
void -
drawRowBackground(g, data, selected, x, y, width, height) → {void}
-
绘制行背景色,默认仅在选中该行时填充选中背景色,可重载自定义
Parameters:
Name Type Description g
CanvasRenderingContext2D 画笔对象
data
ht.Data 数据元素
selected
boolean 数据元素是否选中
x
number 左上角x坐标
y
number 左上角y坐标
width
number 绘制的宽度
height
number 绘制的高度
Returns:
void -
enableToolTip() → {void}
-
启用ToolTip
Returns:
void -
getCheckColumn() → {ht.Column}
-
获取 check 列对象
Returns:
ht.Column -
getCheckIcon(data) → {string}
-
返回data对象对应的check图标,可重载自定义check图标,该函数在checkMode模式下有效
Parameters:
Name Type Description data
ht.Data 数据元素
Returns:
string -
getColumnAt(pointOrEvent) → {ht.Column}
-
获取鼠标下的列
Parameters:
Name Type Description pointOrEvent
Object 鼠标或Touch事件
Returns:
ht.Column -
getColumnLineColor() → {string}
-
获取列线颜色
Returns:
string -
getColumnModel() → {ht.DataModel}
-
获取列模型, 列模型用于存储Column列对象信息
Returns:
ht.DataModel -
getCurrentSortFunc() → {function}
-
默认返回sortFunc函数,当sortColumn不为空时将返回其对应的排序函数
Returns:
function -
getDataAt(pointOrEvent) → {ht.Data}
-
传入逻辑坐标点或者交互event事件参数,返回当前点下的数据元素
Parameters:
Name Type Description pointOrEvent
Object 逻辑坐标点或交互事件对象(如鼠标事件对象)
-
getDataModel() → {ht.DataModel}
-
获取绑定的数据模型
-
getEndRowIndex() → {number}
-
获取当前可见区域的结束行索引
Returns:
number -
getFocusData() → {ht.Data}
-
在checkMode模式下数据除了被选中有check状态外,还可以有被点击行的focus状态
此方法获取focus数据元素Returns:
ht.Data -
getHeight() → {number}
-
获取布局高度
Returns:
number -
getLabel(data) → {string}
-
获取data对象显示的文字,默认返回data.toLabel(),可重载自定义
Parameters:
Name Type Description data
ht.Data 数据元素
Returns:
string -
getLabelColor(data) → {string}
-
获取data对象的文本颜色,可重载自定义
Parameters:
Name Type Description data
ht.Data 数据元素
Returns:
string -
getLabelFont(data) → {string}
-
获取data对象的文本字体,可重载自定义
Parameters:
Name Type Description data
ht.Data 数据元素
Returns:
string -
getLabelSelectColor() → {string}
-
获取选中文本的颜色
Returns:
string -
getLogicalPoint(event) → {Object}
-
传入HTML事件对象,将事件坐标转换为组件中的逻辑坐标
Parameters:
Name Type Description event
Event 事件对象
Returns:
Object -
getRowDatas() → {ht.List}
-
获取当前显示的Data对象集合,该集合已被排序和过滤
Returns:
ht.List -
getRowHeight() → {number}
-
获取行高
Returns:
number -
getRowIndex(data) → {number}
-
获取data对象所在的行索引
Parameters:
Name Type Description data
ht.Data 数据元素
Returns:
number -
getRowLineColor() → {string}
-
获取行线颜色
Returns:
string -
getRowSize() → {number}
-
返回当前可见行总行数
Returns:
number -
getScrollBarColor() → {string}
-
获取滚动条颜色
Returns:
string -
getScrollBarSize() → {number}
-
获取滚动条宽度
Returns:
number -
getSelectableFunc() → {function}
-
获取选择过滤器函数
Returns:
function -
getSelectBackground() → {string}
-
获取行选中背景颜色
Returns:
string -
getSelectionModel() → {ht.SelectionModel}
-
获取选中模型
Returns:
ht.SelectionModel -
getSortColumn() → {ht.Column}
-
获取当前排序列
Returns:
ht.Column -
getSortFunc() → {function}
-
获取排序函数
Returns:
function -
getSortMode() → {string}
-
获取排序方式
none:不允许排序
bistate:点击表头时正序和倒序两种方式之间切换
tristate:点击表头时正序、倒序、不排序三种方式之间切换Returns:
string -
getStartRowIndex() → {number}
-
获取当前可见区域的起始行索引
Returns:
number -
getToolTip(pointOrEvent) → {string}
-
获取ToolTip文字,可重载返回自定义的toolTip文字
Parameters:
Name Type Description pointOrEvent
Object 鼠标或Touch事件对象
Returns:
string -toolTip文字,默认取出鼠标下的图元,然后返回其getToolTip()
-
getValue(data, column) → {Object}
-
获取单元格中要显示的内容
Returns:
Object -
getView() → {HTMLDivElement}
-
获取组件的根层div
Returns:
HTMLDivElement -
getViewRect() → {Object}
-
获取组件中可见区域的逻辑尺寸
Returns:
Object -
getVisibleFunc() → {function}
-
获取可见过滤器函数
Returns:
function -
getWidth() → {number}
-
获取布局宽度
Returns:
number -
invalidate(delay) → {void}
-
无效组件,并调用延时刷新
Parameters:
Name Type Attributes Description delay
number <optional>
延迟刷新的间隔事件(单位:ms)
Returns:
void -
invalidateData(data) → {void}
-
无效数据元素
Parameters:
Name Type Description data
ht.Data 要无效的数据元素
Returns:
void -
invalidateModel() → {void}
-
无效模型,最彻底的刷新方式
Returns:
void -
isAutoHideScrollBar() → {boolean}
-
是否自动隐藏滚动条
Returns:
boolean -
isAutoMakeVisible() → {boolean}
-
选中数据元素时,是否自动平移组件以确保该元素出现在可见区域内
Returns:
boolean -
isBatchEditable() → {boolean}
-
是否启用批量编辑
Returns:
boolean -
isCellEditable(data, column) → {boolean}
-
判断单元格是否可编辑
Returns:
boolean -
isCheckMode() → {boolean}
-
是否是check模式
Returns:
boolean -
isColumnLineVisible() → {boolean}
-
获取列线是否可见,默认为true
Returns:
boolean -
isDisabled() → {boolean}
-
组件是否处于不可用状态,处于此状态时不能进行任何操作并且会遮挡一层蒙板
Returns:
boolean -
isEditable() → {boolean}
-
返回可否编辑的总开关,默认为false,每个Column列对象可再控制
Returns:
boolean -
isRowLineVisible() → {boolean}
-
获取行线是否可见,默认为true
Returns:
boolean -
isSelectable(data) → {boolean}
-
判断data对象是否可被选中
Parameters:
Name Type Description data
ht.Data 数据元素
Returns:
boolean -
isSelected(data) → {boolean}
-
判断data对象是否被选中
Parameters:
Name Type Description data
ht.Data 图元
Returns:
boolean -
isSelectedById(id) → {boolean}
-
根据id判断data对象是否被选中
Parameters:
Name Type Description id
string | number 数据元素id
Returns:
boolean -
isSelectionModelShared() → {boolean}
-
当前组件是否共享选中模型
Returns:
boolean -
isVisible(data) → {boolean}
-
判断数据元素是否可见
Parameters:
Name Type Description data
ht.Data 数据元素
Returns:
boolean -
iv(delay) → {void}
-
无效组件,并调用延时刷新
Parameters:
Name Type Attributes Description delay
number <optional>
延迟刷新的间隔事件(单位:ms)
Returns:
void -
ivm() → {void}
-
无效模型,重新构造内部的rows数据,最彻底的刷新方式,invalidateModel的缩写
Returns:
void -
lp(event) → {Object}
-
传入HTML事件对象,将事件坐标转换为组件中的逻辑坐标,getLogicalPoint的缩写
Parameters:
Name Type Description event
Event 事件对象
Returns:
Object -
makeVisible(data) → {void}
-
平移组件以确保数据元素在可见区域内
Parameters:
Name Type Description data
ht.Data 数据元素
Returns:
void -
mp(listener, scope, ahead) → {void}
-
增加自身属性变化事件监听器,addPropertyChangeListener的缩写
Parameters:
Name Type Attributes Description listener
function 监听器函数
scope
Object <optional>
监听器函数域
ahead
boolean <optional>
是否将当前监听器插入到监听器列表开头
Returns:
void -
onDataClicked(data, e) → {void}
-
数据元素被点击时回调,可重载做后续处理
Parameters:
Name Type Description data
ht.Data 被点击的数据元素
e
Event 事件对象
Returns:
void -
onDataDoubleClicked(data, e) → {void}
-
数据元素被双击时回调,可重载做后续处理
Parameters:
Name Type Description data
ht.Data 双击的数据元素
e
Event 事件对象
Returns:
void -
onTranslateEnded() → {void}
-
平移动画结束时回调,可重载做后续处理
Returns:
void -
redraw() → {void}
-
重绘组件中所有行,仅次于invalidateModel的彻底刷新方式
Returns:
void -
removeBottomPainter(painter) → {void}
-
删除底层Painter
Parameters:
Name Type Description painter
Object | function Painter类
Returns:
void -
removePropertyChangeListener(listener, scope) → {void}
-
删除自身属性变化事件监听器
Parameters:
Name Type Attributes Description listener
function 监听器函数
scope
Object <optional>
监听器函数域
Returns:
void -
removeSelection() → {void}
-
删除所有选中的图元
Returns:
void -
removeTopPainter(painter) → {void}
-
删除顶层Painter
Parameters:
Name Type Description painter
Object | function Painter类
Returns:
void -
removeViewListener(listener, scope) → {void}
-
删除视图事件监听器
Parameters:
Name Type Attributes Description listener
function 监听器函数
scope
Object <optional>
监听器函数域
Returns:
void -
scrollToIndex(index) → {void}
-
平移(滚动)组件至指定的行号
Parameters:
Name Type Description index
number 行号
Returns:
void -
selectAll() → {void}
-
选中所有数据元素
Returns:
void -
setAutoHideScrollBar(v) → {void}
-
设置是否自动隐藏滚动条
Parameters:
Name Type Description v
boolean Returns:
void -
setAutoMakeVisible(v) → {void}
-
设置当选中数据元素,是否自动平移(滚动)组件以确保该数据元素出现在可见区域内
Parameters:
Name Type Description v
boolean Returns:
void -
setBatchEditable(v) → {void}
-
设置是否启用批量编辑
Parameters:
Name Type Description v
boolean Returns:
void -
setCheckMode(v) → {void}
-
设置是否为check模式,默认为false,为true时自动插入checkColumn列
Parameters:
Name Type Description v
boolean Returns:
void -
setColumnLineColor(color) → {void}
-
设置列线颜色
Parameters:
Name Type Description color
string Returns:
void -
setColumnLineVisible(v) → {void}
-
设置列线是否可见
Parameters:
Name Type Description v
boolean Returns:
void -
setColumns(v) → {void}
-
以json的方式配置表格中的列
Parameters:
Name Type Description v
Array.<Object> Returns:
voidExample
//示例: tableView.setColumns([{ name: 'id', displayName: '序号' }, { name: 'background', accessType: 'style' } ]);
-
setDataModel(dataModel) → {void}
-
设置绑定的数据模型
Parameters:
Name Type Description dataModel
ht.DataModel 数据模型
Returns:
void -
setDisabled(value, iconUrl) → {void}
-
设置组件是否处于不可用状态,处于不可用状态时不能进行任何操作并且会遮挡一层蒙板
Parameters:
Name Type Attributes Description value
boolean 是否禁用组件
iconUrl
string <optional>
蒙板上显示的icon的路径
Returns:
void -
setEditable(editable) → {void}
-
设置可否编辑的总开关,默认为false,每个Column列对象可再控制
Parameters:
Name Type Description editable
boolean Returns:
void -
setFocusData(data) → {void}
-
在checkMode模式下数据除了被选中有check状态外,还可以有被点击行的focus状态
此方法设置focus的数据元素Parameters:
Name Type Description data
ht.Data 数据元素
Returns:
void -
setFocusDataById(id) → {void}
-
在checkMode模式下数据除了被选中有check状态外,还可以有被点击行的focus状态
此方法设置focus的数据元素Parameters:
Name Type Description id
string | number 数据元素的id
Returns:
void -
setHeight(v) → {void}
-
设置布局高度
Parameters:
Name Type Description v
number 高度值
Returns:
void -
setLabelColor(v) → {void}
-
设置行label文字颜色
Parameters:
Name Type Description v
string Returns:
void -
setLabelFont(v) → {void}
-
设置行label文字字体
Parameters:
Name Type Description v
string Returns:
void -
setLabelSelectColor(v) → {void}
-
设置行label文字选中颜色
Parameters:
Name Type Description v
string Returns:
void -
setRowHeight(v) → {void}
-
设置行高
Parameters:
Name Type Description v
number Returns:
void -
setRowLineColor(color) → {void}
-
设置行线颜色
Parameters:
Name Type Description color
string Returns:
void -
setRowLineVisible(v) → {void}
-
设置行线是否可见
Parameters:
Name Type Description v
boolean Returns:
void -
setScrollBarColor(color) → {void}
-
设置滚动条颜色
Parameters:
Name Type Description color
string 颜色值
Returns:
void -
setScrollBarSize(size) → {void}
-
设置滚动条宽度
Parameters:
Name Type Description size
number 宽度值
Returns:
void -
setSelectableFunc(func) → {void}
-
设置选择过滤器函数
Parameters:
Name Type Description func
function 过滤器函数
Returns:
void -
setSelectBackground(color) → {void}
-
设置行选中背景颜色
Parameters:
Name Type Description color
string Returns:
void -
setSelectionModelShared(v) → {void}
-
设置组件是否共享选中模型
Parameters:
Name Type Description v
boolean Returns:
void -
setSortColumn(column) → {void}
-
设置排序列
Parameters:
Name Type Description column
ht.Column Returns:
void -
setSortFunc(func) → {void}
-
设置排序函数
Parameters:
Name Type Description func
function Returns:
void -
setSortMode(mode) → {void}
-
设置排序方式
Parameters:
Name Type Description mode
string none:不允许排序
bistate:点击表头时正序和倒序两种方式之间切换
tristate:点击表头时正序、倒序、不排序三种方式之间切换Returns:
void -
setTranslate(x, y, anim) → {void}
-
设置垂直平移值
Parameters:
Name Type Attributes Description x
number 水平平移值,此参数无效
y
number 垂直平移值
anim
boolean <optional>
是否使用动画
Returns:
void -
setTranslateX(v) → {void}
-
设置水平平移值
Parameters:
Name Type Description v
number 垂直平移值
Returns:
void -
setTranslateY(v) → {void}
-
设置垂直平移值
Parameters:
Name Type Description v
number 垂直平移值
Returns:
void -
setVisibleFunc(func) → {void}
-
设置可见过滤器
Parameters:
Name Type Description func
function 过滤器函数
Returns:
void -
setWidth(v) → {void}
-
设置布局宽度
Parameters:
Name Type Description v
number 宽度值
Returns:
void -
sm() → {ht.SelectionModel}
-
获取选中模型,getSelectionModel的缩写
Returns:
ht.SelectionModel -
translate(x, y, anim) → {void}
-
在当前值基础上增加垂直平移值(水平无效)
Parameters:
Name Type Attributes Description x
number 新增的水平平移值,此参数无效
y
number 新增的垂直平移值
anim
boolean <optional>
是否使用动画
Returns:
void -
ump(listener, scope) → {void}
-
删除自身属性变化事件监听器,removePropertyChangeListener的缩写
Parameters:
Name Type Attributes Description listener
function 监听器函数
scope
Object <optional>
监听器函数域
Returns:
void -
validate() → {void}
-
立刻刷新组件
Returns:
void