Class: ProgressBar

progressBar = new ht.ui.ProgressBar();
progressBar.setBar('rgb(232, 237, 242)');
progressBar.setSelectBar('rgb(26, 188, 156)');
progressBar.addToDOM(window, {x: 10, y: 20, width: 120, height: 26});

Extends

• ht.ui.View

Methods

addPropertyChangeListener(listener, scope, ahead)

增加属性事件变化监听函数

Parameters:

Name	Type	Argument	Description
listener	function		监听器函数
scope	Object	<optional>	函数域
ahead	Boolean	<optional>	是否将当前监听器插入到监听器列表开头

Inherited From:

• ht.ui.View#addPropertyChangeListener

addStyleProperty(property)

追加样式属性，将参数属性加入到样式属性列表中

Parameters:

Name	Type	Description
property	String	属性名

Inherited From:

• ht.ui.View#addStyleProperty

addToDOM(dom, rect)

将组件加到页面的 DOM 树中；如果没有任何参数，或者只指定第一个参数并且第一个参数为 window，则组件会填满整个浏览器窗口， 并且浏览器窗口大小变化时也会自动刷新组件

Parameters:

Name	Type	Argument	Description
dom	HTMLElement	<optional>	指定组件的父亲 DOM，如果为空，则加到 body 中
rect	Object	<optional>	组件的范围，格式为 {x: x, y: y, width: width, height: height}；如果为空，则填满父亲 DOM

Inherited From:

• ht.ui.View#addToDOM

addViewListener(listener, scope, ahead)

增加 View 事件监听器，如 invalidate(无效事件)、beginValidate 等事件

Parameters:

Name	Type	Argument	Description
listener	function		监听器函数
scope	Object	<optional>	监听器函数域
ahead	Boolean	<optional>	是否将当前监听器插入到监听器列表开头

Inherited From:

• ht.ui.View#addViewListener

disableToolTip()

禁用工具提示，同 setToolTipEnabled

See:

• setToolTipEnabled

drawBackground(background, x, y, width, height, dom)

绘制背景

Parameters:

Name	Type	Argument	Description
background	ht.ui.drawable.Drawable		背景 Drawable
x	Number	<optional>	起点 x 坐标
y	Number	<optional>	起点 y 坐标
width	Number	<optional>	宽度
height	Number	<optional>	高度
dom	HTMLElement	<optional>	指定绘制的目标 DOM

Inherited From:

• ht.ui.View#drawBackground

drawBar(drawable, x, y, width, height)

绘制进度条背景

Parameters:

Name	Type	Description
drawable	ht.ui.drawable.Drawable	背景 Drawable 对象
x	Number	绘制范围 x 坐标
y	Number	绘制范围 y 坐标
width	Number	绘制范围的宽度
height	Number	绘制范围的高度

drawBorder(border, x, y, width, height, dom)

绘制边框

Parameters:

Name	Type	Argument	Description
border	ht.border.Border		边框对象
x	Number	<optional>	起点 x 坐标
y	Number	<optional>	起点 y 坐标
width	Number	<optional>	宽度
height	Number	<optional>	高度
dom	HTMLElement	<optional>	指定绘制的目标 DOM

Inherited From:

• ht.ui.View#drawBorder

drawPercentText(text, font, color, x, y, width, height)

绘制百分比文本

Parameters:

Name	Type	Description
text	String	文本内容
font	String	字体
color	color	文字颜色
x	Number	绘制范围 x 坐标
y	Number	绘制范围 y 坐标
width	Number	绘制范围的宽度
height	Number	绘制范围的高度

drawSelectBar(drawable, x, y, width, height)

绘制进度条前景

Parameters:

Name	Type	Description
drawable	ht.ui.drawable.Drawable	前景 Drawable 对象
x	Number	绘制范围 x 坐标
y	Number	绘制范围 y 坐标
width	Number	绘制范围的宽度
height	Number	绘制范围的高度

enableToolTip()

启用工具提示，同 setToolTipEnabled

See:

• setToolTipEnabled

figureMaxSize() → {Object}

计算 maxSize，maxSize 表示组件的最大尺寸，布局器布局时会考虑此尺寸；

Inherited From:

• ht.ui.View#figureMaxSize

Returns:

maxSize

Type

Object

figureMinSize() → {Object}

计算 minSize，minSize 表示组件的最小尺寸，布局器布局时会考虑此尺寸；

Inherited From:

• ht.ui.View#figureMinSize

Returns:

minSize

Type

Object

figurePercentText() → {String}

计算百分比并返回百分比文字；可重写返回自定义的文字格式

Returns:

百分比文字

Type

String

figurePreferredSize() → {Object}

计算 preferredSize，preferredSize 表示组件自身最合适的尺寸，布局器布局时会考虑此尺寸； 如果自定义组件一般需要重写此函数

Inherited From:

• ht.ui.View#figurePreferredSize

Returns:

preferredSize

Type

Object

fireViewEvent(event)

派发 View 事件

Parameters:

Name	Type	Description
event	Object | String	事件对象；如果是字符串，表示事件类型，函数内自动组装一个事件对象并派发 示例：view.fireViewEvent('myevent') 等同于 view.fireViewEvent({kind: 'myevent'})

Inherited From:

• ht.ui.View#fireViewEvent

fp(property, oldValue, newValue, compareFunc) → {Boolean}

派发属性变化事件，firePropertyChange 的缩写

Parameters:

Name	Type	Argument	Description
property	String		属性名
oldValue	Object		属性变化之前的值
newValue	Object		属性变化之后的值
compareFunc	function	<optional>	比较函数，用于比较新值和旧值是否一致，如果一致则不会派发事件

Inherited From:

• ht.ui.View#fp

Returns:

事件是否派发成功

Type

Boolean

getBackground() → {Object}

获取组件的背景，可以是颜色或者图片等

Inherited From:

• ht.ui.View#getBackground

See:

• getBackgroundDrawable

Returns:

组件背景

Type

Object

getBackgroundDrawable() → {ht.ui.drawable.Drawable}

获取组件背景的 Drawable 对象

Inherited From:

• ht.ui.View#getBackgroundDrawable

Returns:

组件背景

Type

ht.ui.drawable.Drawable

getBar() → {Object}

获取进度条背景，可以是颜色或者图片等

See:

• getBarDrawable

Returns:

背景

Type

Object

getBarDrawable() → {ht.ui.drawable.Drawable}

获取进度条背景的 Drawable 对象

Returns:

背景

Type

ht.ui.drawable.Drawable

getBorder() → {ht.border.Border}

获取组件的边框

Inherited From:

• ht.ui.View#getBorder

Returns:

组件边框

Type

ht.border.Border

getBorderBottom() → {Number}

获取组件边框的底部高度

Inherited From:

• ht.ui.View#getBorderBottom

Returns:

组件边框底部高度

Type

Number

getBorderLeft() → {Number}

获取组件边框的左侧宽度

Inherited From:

• ht.ui.View#getBorderLeft

Returns:

组件边框左侧宽度

Type

Number

getBorderRadius() → {Number|Array}

获取 CSS 边框圆角

Inherited From:

• ht.ui.View#getBorderRadius

Returns:

边框圆角

Type

Number | Array

getBorderRight() → {Number}

获取组件边框的右侧宽度

Inherited From:

• ht.ui.View#getBorderRight

Returns:

组件边框右侧宽度

Type

Number

getBorderTop() → {Number}

获取组件边框的顶部高度

Inherited From:

• ht.ui.View#getBorderTop

Returns:

组件边框顶部高度

Type

Number

getBoxShadow() → {String}

获取 CSS 阴影值

Inherited From:

• ht.ui.View#getBoxShadow

Returns:

阴影值

Type

String

getContentBottom() → {Number}

获取内容底部距离，即底部边框高度加底部内边距高度

Inherited From:

• ht.ui.View#getContentBottom

Returns:

内容底部距离

Type

Number

getContentDiv() → {HTMLElement}

获取内容 div；对于普通组件，contentDiv 里放置了 canvas 画布；对于容器组件，contentDiv 里除了画布，还有所有的子组件

Inherited From:

• ht.ui.View#getContentDiv

Returns:

内容 div

Type

HTMLElement

getContentHeight() → {Number}

获取内容高度，即组件高度减去边框高度和上下内边距高度

Inherited From:

• ht.ui.View#getContentHeight

Returns:

内容高度

Type

Number

getContentLeft() → {Number}

获取内容左侧距离，即左侧边框宽度加左侧内边距宽度

Inherited From:

• ht.ui.View#getContentLeft

Returns:

内容左侧距离

Type

Number

getContentPoint(event) → {Object}

获取内容坐标点；此坐标与内边距和边框无关，是从内容区域左上角开始计算

Parameters:

Name	Type	Description
event	Event	交互事件对象(如鼠标事件对象)

Inherited From:

• ht.ui.View#getContentPoint

Returns:

内容坐标点，包含 x、y 坐标

Type

Object

getContentRight() → {Number}

获取内容右侧距离，即右侧边框宽度加右侧内边距宽度

Inherited From:

• ht.ui.View#getContentRight

Returns:

内容右侧距离

Type

Number

getContentTop() → {Number}

获取内容顶部距离，即顶部边框高度加顶部内边距高度

Inherited From:

• ht.ui.View#getContentTop

Returns:

内容顶部距离

Type

Number

getContentWidth() → {Number}

获取内容宽度，即组件宽度减去边框宽度和左右内边距宽度

Inherited From:

• ht.ui.View#getContentWidth

Returns:

内容宽度

Type

Number

getContextMenu() → {ht.ui.ContextMenu}

获取绑定的右键菜单

Inherited From:

• ht.ui.View#getContextMenu

Returns:

右键菜单

Type

ht.ui.ContextMenu

getCursor() → {String}

获取鼠标样式(CSS 格式)

Inherited From:

• ht.ui.View#getCursor

Returns:

鼠标样式

Type

String

getDisabledBackground() → {String}

组件被禁用时，遮罩的背景；这个值被设置到遮罩 div 的 background 样式上，因此可以使用所有 CSS 支持的 background 类型

Inherited From:

• ht.ui.View#getDisabledBackground

Returns:

遮罩背景

Type

String

getDOMProperties() → {Object}

获取 DOM 属性映射表，格式为：{'width': true ...}；这些属性发生变化才会更新 DOM 结构，否则只需要绘制内容即可

Inherited From:

• ht.ui.View#getDOMProperties

Returns:

DOM 属性映射表

Type

Object

getErrorMessage() → {String}

获取错误信息

Inherited From:

• ht.ui.View#getErrorMessage

Returns:

错误信息

Type

String

getFixedSize() → {Number}

获取不确定模式下，前景条的尺寸；此值如果小于 1，表示百分比；大于 1 表示固定尺寸

Returns:

尺寸值

Type

Number

getHeight() → {Number}

获取组件的高度

Inherited From:

• ht.ui.View#getHeight

Returns:

组件高度

Type

Number

getId() → {Object}

获取唯一标识，根据标识可快速查找到组件

Inherited From:

• ht.ui.View#getId

Returns:

唯一标识

Type

Object

getInteractorClasses() → {Array}

获取交互器类名数组

Inherited From:

• ht.ui.View#getInteractorClasses

Returns:

交互器类名数组

Type

Array

getLayoutParams(key) → {Object}

获取布局参数

Parameters:

Name	Type	Argument	Description
key	String	<optional>	布局参数中的 key

Inherited From:

• ht.ui.View#getLayoutParams

Returns:

如果指定 key 参数返回布局参数中 key 对应的值，否则返回整个布局参数对象

Type

Object

getMargin() → {Number|Array}

获取组件外边距，如果是数字，说明四边使用相同的外边距；如果是数组，则格式为：[上边距, 右边距, 下边距, 左边距]

Inherited From:

• ht.ui.View#getMargin

Returns:

外边距

Type

Number | Array

getMarginBottom() → {Number}

获取组件底部外边距高度

Inherited From:

• ht.ui.View#getMarginBottom

Returns:

底部外边距高度

Type

Number

getMarginRight() → {Number}

获取组件右侧外边距宽度

Inherited From:

• ht.ui.View#getMarginRight

Returns:

右侧外边距宽度

Type

Number

getMarginTop() → {Number}

获取组件顶部外边距高度

Inherited From:

• ht.ui.View#getMarginTop

Returns:

顶部外边距高度

Type

Number

getMarignLeft() → {Number}

获取组件左侧外边距宽度

Inherited From:

• ht.ui.View#getMarignLeft

Returns:

左侧外边距宽度

Type

Number

getMatchedStyles() → {Object}

获取组件匹配到的样式

Inherited From:

• ht.ui.View#getMatchedStyles

Returns:

Type

Object

getMax() → {Number}

获取进度结束值

Returns:

结束值

Type

Number

getMaxSize() → {Object}

获取 maxSize，maxSize 表示组件自身最合适的尺寸； 如果用户没有设置，则调用 figureMaxSize 计算

Inherited From:

• ht.ui.View#getMaxSize

Returns:

maxSize

Type

Object

getMaxSizeProperties() → {Object}

获取 maxSize 属性映射表，格式为：{'border': true ...}；这些属性变化会重新计算 maxSize

Inherited From:

• ht.ui.View#getMaxSizeProperties

Returns:

maxSize 属性映射表

Type

Object

getMin() → {Number}

获取进度起始值

Returns:

起始值

Type

Number

getMinSize() → {Object}

获取 minSize，minSize 表示组件的最小尺寸； 如果用户没有设置，则调用 figureMinSize 计算

Inherited From:

• ht.ui.View#getMinSize

Returns:

minSize

Type

Object

getMinSizeProperties() → {Object}

获取 minSize 属性映射表，格式为：{'border': true ...}；这些属性变化会重新计算 minSize

Inherited From:

• ht.ui.View#getMinSizeProperties

Returns:

minSize 属性映射表

Type

Object

getOrientation() → {String}

获取进度条显示方向

Returns:

显示方向，值可能为：'horizontal'|'vertical'

Type

String

getPadding() → {Number|Array}

获取组件内边距，如果是数字，说明四边使用相同的内边距；如果是数组，则格式为：[上边距, 右边距, 下边距, 左边距]

Inherited From:

• ht.ui.View#getPadding

Returns:

内边距

Type

Number | Array

getPaddingBottom() → {Number}

获取组件底部内边距高度

Inherited From:

• ht.ui.View#getPaddingBottom

Returns:

底部内边距高度

Type

Number

getPaddingLeft() → {Number}

获取组件左侧内边距宽度

Inherited From:

• ht.ui.View#getPaddingLeft

Returns:

左侧内边距宽度

Type

Number

getPaddingRight() → {Number}

获取组件右侧内边距宽度

Inherited From:

• ht.ui.View#getPaddingRight

Returns:

右侧内边距宽度

Type

Number

getPaddingTop() → {Number}

获取组件顶部内边距高度

Inherited From:

• ht.ui.View#getPaddingTop

Returns:

顶部内边距高度

Type

Number

getParent() → {ht.ui.ViewGroup}

获取父容器

Inherited From:

• ht.ui.View#getParent

Returns:

父容器

Type

ht.ui.ViewGroup

getPercentTextColor() → {color}

获取百分比文字颜色

Returns:

百分比文字颜色

Type

color

getPercentTextFont() → {String}

获取百分比文字字体

Returns:

百分比文字字体

Type

String

getPopover() → {ht.ui.Popover}

获取弹框组件

Inherited From:

• ht.ui.View#getPopover

Returns:

弹框组件

Type

ht.ui.Popover

getPopoverPlacements() → {Array}

获取弹框组件的弹出位置

Inherited From:

• ht.ui.View#getPopoverPlacements

Returns:

弹出位置

Type

Array

getPopoverTrigger() → {String}

获取弹框触发器

Inherited From:

• ht.ui.View#getPopoverTrigger

Returns:

弹框触发器，值为：click|hover

Type

String

getPreferredSize() → {Object}

获取 preferredSize，preferredSize 表示组件自身最合适的尺寸，布局器布局时会考虑此尺寸； 如果用户没有设置，则调用 figurePreferredSize 计算

Inherited From:

• ht.ui.View#getPreferredSize

Returns:

preferredSize

Type

Object

getPreferredSizeProperties() → {Object}

获取 preferredSize 属性映射表，格式为：{'border': true ...}；这些属性变化会重新计算 preferredSize

Inherited From:

• ht.ui.View#getPreferredSizeProperties

Returns:

preferredSize 属性映射表

Type

Object

getPropertyValue(name) → {Object}

取组件的某个属性的原始值； 不要直接去取私有变量，例如 padding，不要直接取 _padding 私有变量，而是应该使用此函数取值； 此函数取值顺序：

• 先取 _padding 私有变量
• 如果为 undefind，再去取样式表中取值
• 如果为 undefied，再取 __padding 私有变量

Parameters:

Name	Type	Description
name	String	属性名

Inherited From:

• ht.ui.View#getPropertyValue

Returns:

属性值

Type

Object

Example

// 这段代码演示了覆盖 getPadding 函数，先取出旧的 padding，再 +2 并返回
button.getPadding = function() {
	var oldPadding = this.getPropertyValue('padding');
	oldPadding += 2;
	return oldPadding;
}

getRootCanvas() → {HTMLCanvasElement}

获取根 Canvas，这个 Canvas 用来绘制背景、边框、内容等

Inherited From:

• ht.ui.View#getRootCanvas

Returns:

Canvas DOM 对象

Type

HTMLCanvasElement

getRootContext(dom) → {CanvasRenderingContext2D}

获取默认的 canvas 画布的画笔对象，或者获取参数 DOM 对象的画笔； 此函数在绘制背景、边框和自定义组件的情况下经常使用

Parameters:

Name	Type	Argument	Description
dom	HTMLElement	<optional>	指定目标 DOM，通常是个 canvas 类型的 DOM 对象

Inherited From:

• ht.ui.View#getRootContext

Returns:

画笔对象

Type

CanvasRenderingContext2D

getSelectBar() → {Object}

获取前景(即进度覆盖区域)，可以是颜色或者图片等

See:

• getSelectBarDrawable

Returns:

前景

Type

Object

getSelectBarDrawable() → {ht.ui.drawable.Drawable}

获取前景(即进度覆盖区域)的 Drawable 对象，可以是颜色或者图片等

Returns:

前景

Type

ht.ui.drawable.Drawable

getStyle() → {String}

获取组件的样式名；如果有多个样式名，以空格分开，如：'header title'；注意此样式是指 HT 的样式，而非 CSS 样式

Inherited From:

• ht.ui.View#getStyle

Returns:

样式名

Type

String

getStyleProperties() → {Object}

获取样式属性映射表，格式为：{'padding': true, 'border': true ...}

Inherited From:

• ht.ui.View#getStyleProperties

Returns:

样式属性映射表

Type

Object

getStyleValue(property) → {Object}

获取样式属性对应的样式值

Parameters:

Name	Type	Description
property	String	属性名

Inherited From:

• ht.ui.View#getStyleValue

Returns:

样式值

Type

Object

getToolTip() → {String}

获取工具提示文本内容

Returns:

工具提示文本内容

Type

String

getValue() → {Number}

获取当前进度值

Returns:

进度值

Type

Number

getView() → {HTMLElement}

获取组件最根层的 div

Inherited From:

• ht.ui.View#getView

Returns:

组件 div

Type

HTMLElement

getViewPoint(event) → {Object}

获取组件坐标点；从组件的左上角开始计算

Parameters:

Name	Type	Description
event	Event	交互事件对象(如鼠标事件对象)

Inherited From:

• ht.ui.View#getViewPoint

Returns:

组件坐标点，包含 x、y 坐标

Type

Object

getWidth() → {Number}

获取组件的宽度

Inherited From:

• ht.ui.View#getWidth

Returns:

组件宽度

Type

Number

getX() → {Number}

获取组件的 x 坐标

Inherited From:

• ht.ui.View#getX

Returns:

x 坐标

Type

Number

getY() → {Number}

获取组件的 y 坐标

Inherited From:

• ht.ui.View#getY

Returns:

y 坐标

Type

Number

getZIndex() → {Number}

获取组件的堆叠顺序

Inherited From:

• ht.ui.View#getZIndex

Returns:

堆叠顺序

Type

Number

getZoom() → {Number}

获取缩放值

Inherited From:

• ht.ui.View#getZoom

Returns:

缩放值

Type

Number

getZoomAnchor() → {Array}

获取缩放锚点

Inherited From:

• ht.ui.View#getZoomAnchor

Returns:

锚点数组

Type

Array

hasContentCanvas() → {Boolean}

判断组件是否有私有 canvas

Inherited From:

• ht.ui.View#hasContentCanvas

Returns:

组件是否有私有 canvas

Type

Boolean

hasFocus() → {Boolean}

判断焦点是否在组件上

Inherited From:

• ht.ui.View#hasFocus

Returns:

焦点是否在组件上

Type

Boolean

hidePopover()

隐藏弹框组件

Inherited From:

• ht.ui.View#hidePopover

initView(canvas)

初始化组件的 DOM 结构

Parameters:

Name	Type	Argument	Description
canvas	Boolean	<optional>	是否创建一个私有的 canvas 用来绘制私有内容，一般情况下在默认的 canvas 中绘制就可以，不需要此参数

Inherited From:

• ht.ui.View#initView

invalidate(forceLayoutChildren)

使组件无效化

Parameters:

Name	Type	Argument	Description
forceLayoutChildren	Boolean	<optional>	是否强制刷新子组件(即使子组件没有无效标记)

Inherited From:

• ht.ui.View#invalidate

See:

• iv

invalidateDOM()

设置重新布局 DOM 标记并调用 invalidate, 组件下次刷新时会强制更新 DOM

Inherited From:

• ht.ui.View#invalidateDOM

isClipSelectBar() → {Boolean}

是否裁切前景条；如果裁切，则在整个进度条范围内绘制前景条，并将其裁切只显示前景条范围内的内容；否则在前景条范围内绘制完整的进度条

Returns:

是否裁切前景条

Type

Boolean

isDescendantOf(viewGroup) → {Boolean}

判断当前组件是否是参数容器的子孙组件

Parameters:

Name	Type	Description
viewGroup	ht.ui.ViewGroup	容器

Inherited From:

• ht.ui.View#isDescendantOf

Returns:

Type

Boolean

isDisabled() → {Boolean}

组件是否被禁用

Inherited From:

• ht.ui.View#isDisabled

Returns:

是否被禁用

Type

Boolean

isFocusable() → {Boolean}

组件是否可以获取焦点

Inherited From:

• ht.ui.View#isFocusable

Returns:

是否可获取焦点

Type

Boolean

isIndeterminate() → {Boolean}

是否是不确定模式；在不确定模式下，前景条的尺寸固定，位置跟随 value 变化；正常模式下，前景条的尺寸随着 value 变化增长或减小

Returns:

是否是不确定模式

Type

Boolean

isInDOM() → {Boolean}

判断组件是否在 DOM 树中

Inherited From:

• ht.ui.View#isInDOM

Returns:

组件是否在 DOM 树中

Type

Boolean

isMaxSizeSet() → {Boolean}

判断 maxSize 是否被设置(如果为 true, 组件不再调用 figureMaxSize 自动计算)

Inherited From:

• ht.ui.View#isMaxSizeSet

Returns:

maxSize 是否被设置

Type

Boolean

isMinSizeSet() → {Boolean}

判断 minSize 是否被设置(如果为 true, 组件不再调用 figureMinSize 自动计算)

Inherited From:

• ht.ui.View#isMinSizeSet

Returns:

minSize 是否被设置

Type

Boolean

isPercentTextVisible() → {Boolean}

是否显示百分比文字

Returns:

是否显示百分比

Type

Boolean

isPreferredSizeSet() → {Boolean}

判断 preferredSize 是否被设置(如果为 true, 组件不再调用 figurePreferredSize 自动计算)

Inherited From:

• ht.ui.View#isPreferredSizeSet

Returns:

preferredSize 是否被设置

Type

Boolean

isRedrawOnFocus() → {Boolean}

判断组件获取或失去焦点时，是否重绘自身

Inherited From:

• ht.ui.View#isRedrawOnFocus

Returns:

是否重绘自身

Type

Boolean

isSelfViewEvent(event) → {Boolean}

判断鼠标事件是否发生在组件自身上，例如容器的 div 上监听到一个原生的鼠标点击事件，此事件可能来自容器，也可能来自子组件的冒泡传播； 如果自定义组件，并且改变了组件的 DOM 结构，需要重写此函数

Parameters:

Name	Type	Description
event	Event	事件对象

Inherited From:

• ht.ui.View#isSelfViewEvent

Returns:

事件是否发生在自身 DOM 上

Type

Boolean

isStyleProperty(property) → {Boolean}

判断属性是否是样式属性

Parameters:

Name	Type	Description
property	String	属性名

Inherited From:

• ht.ui.View#isStyleProperty

Returns:

是否是样式属性

Type

Boolean

isToolTipEnabled() → {Boolean}

是否启用工具提示

Returns:

是否启用工具提示

Type

Boolean

isVisible() → {Boolean}

判断组件是否可见

Inherited From:

• ht.ui.View#isVisible

Returns:

组件是否可见

Type

Boolean

iv(forceLayoutChildren)

使组件无效化

Parameters:

Name	Type	Argument	Description
forceLayoutChildren	Boolean	<optional>	是否强制刷新子组件(即使子组件没有无效标记)

Inherited From:

• ht.ui.View#iv

See:

• invalidate

layoutDOM(x, y, width, height)

重新调整组件的 DOM 结构布局，设置坐标、宽高以及内边距等

Parameters:

Name	Type	Description
x	Number	组件的 x 坐标
y	Number	组件的 y 坐标
width	Number	组件宽度
height	Number	组件高度

Inherited From:

• ht.ui.View#layoutDOM

makeDisabled(disabled, disabledDiv)

设置禁用组件样式，默认会将 disabedDiv 插入到组件内部

Parameters:

Name	Type	Description
disabled	disabled	是否禁用
disabledDiv	HTMLElement	遮罩 div

Inherited From:

• ht.ui.View#makeDisabled

mp(listener, scope, ahead)

增加属性事件变化监听函数，addPropertyChangeListener 的缩写

Parameters:

Name	Type	Argument	Description
listener	function		监听器函数
scope	Object	<optional>	函数域
ahead	Boolean	<optional>	是否将当前监听器插入到监听器列表开头

Inherited From:

• ht.ui.View#mp

off(name, function, scope, ahead)

删除事件监听

Parameters:

Name	Type	Description
name	String	属性名，p: 开头(如 p:value)，表示监听属性变化事件；d: 开头(如 d:mousedown) 表示监听原生 DOM 事件；其它情况当作 viewEvent 处理
function	function	监听器函数
scope	Object	监听器函数域
ahead	Boolean	如果是 DOM 事件，表示 useCapture；否则表示是否将当前监听器插入到监听器列表开头

Inherited From:

• ht.ui.View#off

on(name, function, scope, ahead)

增加事件监听

Parameters:

Name	Type	Description
name	String	属性名，p: 开头(如 p:value)，表示监听的是属性变化事件；d: 开头(如 d:mousedown) 表示监听原生 DOM 事件；其它情况当作 viewEvent 处理
function	function	监听器函数
scope	Object	监听器函数域
ahead	Boolean	如果是 DOM 事件，表示 useCapture；否则表示是否将当前监听器插入到监听器列表开头

Inherited From:

• ht.ui.View#on

onOnce(name, function, scope, ahead)

增加一次性事件监听(监听器执行一次，然后马上被删除)

Parameters:

Name	Type	Description
name	String	属性名，p: 开头(如 p:value)，表示监听属性变化事件；d: 开头(如 d:mousedown) 表示监听原生 DOM 事件；其它情况当作 viewEvent 处理
function	function	监听器函数
scope	Object	监听器函数域
ahead	Boolean	如果是 DOM 事件，表示 useCapture；否则表示是否将当前监听器插入到监听器列表开头

Inherited From:

• ht.ui.View#onOnce

processValidate()

绘制组件边框、背景及调用 validateImpl；此函数在 validate 中被调用

Inherited From:

• ht.ui.View#processValidate

redraw(forceLayoutChildren)

设置所有的重绘标记包括重绘 canvas 标记、重绘 border 标记和重新布局 DOM 标记 并调用 iv

Parameters:

Name	Type	Argument	Description
forceLayoutChildren	Boolean	<optional>	是否强制刷新子组件(即使子组件没有无效标记)

Inherited From:

• ht.ui.View#redraw

removeFromDOM()

将组件从页面的 DOM 树中删除；如果要删除通过 addToDOM 添加到页面的组件，应使用此函数，以免内存泄漏

Inherited From:

• ht.ui.View#removeFromDOM

removePropertyChangeListener(listener, scope)

删除属性事件变化监听器

Parameters:

Name	Type	Argument	Description
listener	function		监听器函数
scope	Object	<optional>	函数域

Inherited From:

• ht.ui.View#removePropertyChangeListener

removeStyleProperty(property)

删除样式属性，将参数属性从样式属性列表中移除

Parameters:

Name	Type	Description
property	String	属性名

Inherited From:

• ht.ui.View#removeStyleProperty

removeViewListener(listener, scope)

删除 View 事件监听器

Parameters:

Name	Type	Argument	Description
listener	function		监听器函数
scope	Object	<optional>	监听器函数域

Inherited From:

• ht.ui.View#removeViewListener

requestFocus()

请求获取焦点

Inherited From:

• ht.ui.View#requestFocus

set(properties)

批量设置组件属性

Parameters:

Name	Type	Description
properties	Object	格式示范：{ background: 'red', border: new ht.ui.border.LineBorder(1, 'red'), padding: 20 }

Inherited From:

• ht.ui.View#set

setBackground(background)

设置组件的背景，可以是颜色或者图片等；此值最终会被转换为 Drawable 对象

Parameters:

Name	Type	Description
background	Object	颜色值、图片名、图片路径、矢量对象等

Inherited From:

• ht.ui.View#setBackground

See:

• setBackgroundDrawable

setBackgroundDrawable(drawable)

设置组件的背景 Drawable 对象；组件渲染时优先使用此 Drawable 对象，如果为空，再用 background 转换

Parameters:

Name	Type	Description
drawable	ht.ui.drawable.Drawable	Drawable 对象

Inherited From:

• ht.ui.View#setBackgroundDrawable

setBar(bar)

设置进度条背景，可以是颜色或者图片等

Parameters:

Name	Type	Description
bar	Object	背景

See:

• setBarDrawable

setBarDrawable(drawable)

设置进度条背景的 Drawable 对象

Parameters:

Name	Type	Description
drawable	ht.ui.drawable.Drawable	背景

setBorder(border)

设置组件的边框

Parameters:

Name	Type	Description
border	ht.border.Border	组件边框

Inherited From:

• ht.ui.View#setBorder

setBorderRadius(radius)

设置 CSS 边框圆角

Parameters:

Name	Type	Description
radius	Number | Array	边框圆角；如果是数组，则表示[左上角圆角、右上角圆角、右下角圆角、左下角圆角]

Inherited From:

• ht.ui.View#setBorderRadius

setBoxShadow(boxShadow)

设置 CSS 阴影值

Parameters:

Name	Type	Description
boxShadow	String	阴影值

Inherited From:

• ht.ui.View#setBoxShadow

setClipSelectBar(clipSelectBar)

设置是否裁切前景条；如果裁切，则在整个进度条范围内绘制前景条，并将其裁切只显示前景条范围内的内容；否则在前景条范围内绘制完整的进度条

Parameters:

Name	Type	Description
clipSelectBar	Boolean	是否裁切前景条

setContextMenu(contextMenu)

设置绑定的右键菜单

Parameters:

Name	Type	Description
contextMenu	ht.ui.ContextMenu	右键菜单

Inherited From:

• ht.ui.View#setContextMenu

setCursor(cursor)

设置鼠标样式(CSS 格式)

Parameters:

Name	Type	Description
cursor	String	鼠标样式

Inherited From:

• ht.ui.View#setCursor

setDisabled(disabled)

设置组件是否被禁用

Parameters:

Name	Type	Description
disabled	Boolean | String	是否被禁用；如果为字符串，组件除了被禁用，disabledDiv 还会被设置相应的 CSS 样式名

Inherited From:

• ht.ui.View#setDisabled

setDisabledBackground(background)

设置组件被禁用时，遮罩的背景；这个值被设置到遮罩 div 的 background 样式上，因此可以使用所有 CSS 支持的 background 类型

Parameters:

Name	Type	Description
background	String	遮罩背景

Inherited From:

• ht.ui.View#setDisabledBackground

Example

// 设置一个居中的 gif 图片 作为背景
view.setDisabledBackground('url(a.gif) no-repeat 50% 50%');

setErrorMessage(message, params) → {ht.ui.ErrorMessagePopover}

设置错误信息

Parameters:

Name	Type	Description
message	String	错误信息
params	Object	ErrorMessagePopover 组件的属性配置，如 { placements: ['top'] } 将错误提示显示在上方

Inherited From:

• ht.ui.View#setErrorMessage

Returns:

错误提示组件

Type

ht.ui.ErrorMessagePopover

setFixedSize(fixedSize)

设置不确定模式下，前景条的尺寸；此值如果小于 1，表示百分比；大于 1 表示固定像素尺寸

Parameters:

Name	Type	Description
fixedSize	Number	尺寸值

setFocusable(focusable)

设置组件是否可以获取焦点

Parameters:

Name	Type	Description
focusable	Boolean	是否可获取焦点

Inherited From:

• ht.ui.View#setFocusable

setHeight(height)

设置组件的高度

Parameters:

Name	Type	Description
height	Number	组件高度

Inherited From:

• ht.ui.View#setHeight

setId(id)

设置唯一标识，根据标识可快速查找到组件

Parameters:

Name	Type	Description
id	Object	唯一标识

Inherited From:

• ht.ui.View#setId

setIndeterminate(indeterminate)

设置不确定模式

Parameters:

Name	Type	Description
indeterminate	Boolean	不确定模式；在不确定模式下，前景条的尺寸固定，位置跟随 value 变化；正常模式下，前景条的尺寸随着 value 变化增长或减小

setLayoutParams(layoutParams, value)

设置布局参数；这个函数有两种使用方式：

• view.setLayoutParams({ marginLeft: 20, marginRight: 20 }) 指定布局参数对象
• view.setLayoutParams('marginLeft', 20) 传入两个参数设置布局参数对象中的属性

Parameters:

Name	Type	Argument	Description
layoutParams	Object		布局参数对象或 key
value	Object	<optional>	布局参数值

Inherited From:

• ht.ui.View#setLayoutParams

setMargin(margin)

设置组件外边距，如果是数字，说明四边使用相同的外边距；如果是数组，则格式为：[上边距, 右边距, 下边距, 左边距]

Parameters:

Name	Type	Description
margin	Number | Array	外边距；父容器布局时，会动态将此参数填充到 layoutParams 中(优先级低于 layoutParams，如果 layoutParams 参数中没有指定相应的 margin 才会从组件上取值)

Inherited From:

• ht.ui.View#setMargin

setMax(max)

设置进度结束值

Parameters:

Name	Type	Description
max	Number	结束值

setMaxSize(width, height)

计算 maxSize，maxSize 表示组件的最大尺寸，布局器布局时会考虑此尺寸，尽量不让组件的布局宽高大于此尺寸； 如果设置过 maxSize，就不会再调用 figureMaxSize 计算； 如果要清空设置过的 maxSize，可以调用 setMaxSize(undefined, undefined);

Parameters:

Name	Type	Description
width	Number	最大宽度
height	Number	最大高度

Inherited From:

• ht.ui.View#setMaxSize

setMin(min)

设置进度起始值

Parameters:

Name	Type	Description
min	Number	起始值

setMinSize(width, height)

计算 minSize，minSize 表示组件的最小尺寸，布局器布局时会考虑此尺寸，尽量不让组件的布局宽高小于此尺寸； 如果设置过 minSize，就不会再调用 figureMinSize 计算； 如果要清空设置过的 minSize，可以调用 setMinSize(undefined, undefined);

Parameters:

Name	Type	Description
width	Number	最小宽度
height	Number	最小高度

Inherited From:

• ht.ui.View#setMinSize

setOrientation(orientation)

设置进度条显示方向

Parameters:

Name	Type	Description
orientation	String	显示方向，可选值为：'horizontal'|'vertical'

setPadding(padding)

设置组件内边距，如果是数字，说明四边使用相同的内边距；如果是数组，则格式为：[上边距, 右边距, 下边距, 左边距]

Parameters:

Name	Type	Description
padding	Number | Array	内边距

Inherited From:

• ht.ui.View#setPadding

setPercentTextColor(color)

设置百分比文字颜色

Parameters:

Name	Type	Description
color	color	百分比文字颜色

setPercentTextFont(font)

设置百分比文字字体

Parameters:

Name	Type	Description
font	String	百分比文字字体

setPercentTextVisible(visible)

设置是否显示百分比文字

Parameters:

Name	Type	Description
visible	Boolean	是否显示百分比

setPopover(popover, trigger)

设置弹框组件

Parameters:

Name	Type	Argument	Description
popover	ht.ui.Popover | String		弹框组件，如果参数是字符串，则用这段文本作为弹框内容(内部自动创建 Popover 和 HtmlView 组件)
trigger	String	<optional>	触发器，值为：click|hover

Inherited From:

• ht.ui.View#setPopover

setPopoverPlacements(placements)

设置弹框组件的弹出位置

Parameters:

Name	Type	Description
placements	Array	位置数组

Inherited From:

• ht.ui.View#setPopoverPlacements

setPopoverTrigger(trigger)

设置弹框触发器

Parameters:

Name	Type	Description
trigger	String	弹框触发器，值为：click|hover

Inherited From:

• ht.ui.View#setPopoverTrigger

setPreferredSize(width, height)

设置 preferredSize，preferredSize 表示组件自身最合适的尺寸，布局器布局时会考虑此尺寸作为布局尺寸； 如果设置过 preferredSize，就不会再调用 figurePreferredSize 计算； 如果要清空设置过的 preferredSize，可以调用 setPreferredSize(undefined, undefined);

Parameters:

Name	Type	Description
width	Number	首选宽度
height	Number	首选高度

Inherited From:

• ht.ui.View#setPreferredSize

setPropertyValue(name, value)

设置属性值并派发事件，自定义 set 函数内部应该调用此函数设值

Parameters:

Name	Type	Description
name	String	属性名
value	Object	属性值

Inherited From:

• ht.ui.View#setPropertyValue

setRedrawOnFocus(redrawOnFocus)

设置组件获取或失去焦点时，是否重绘自身

Parameters:

Name	Type	Description
redrawOnFocus	Boolean	是否重绘自身

Inherited From:

• ht.ui.View#setRedrawOnFocus

setSelectBar(selectBar)

设置前景(即进度覆盖区域)，可以是颜色或者图片等

Parameters:

Name	Type	Description
selectBar	Object	前景

See:

• setSelectBarDrawable

setSelectBarDrawable(drawable)

设置前景(即进度覆盖区域)的 Drawable 对象，可以是颜色或者图片等

Parameters:

Name	Type	Description
drawable	ht.ui.drawable.Drawable	前景

setStyle(styleName)

设置组件的样式名；如果有多个样式名，以空格分开，如：'header title'；注意此样式是指 HT 的样式，而非 CSS 样式

Parameters:

Name	Type	Description
styleName	String	样式名

Inherited From:

• ht.ui.View#setStyle

setToolTipEnabled(enabled)

设置是否启用工具提示

Parameters:

Name	Type	Description
enabled	Boolean	是否启用工具提示

setValue(value)

设置当前进度值

Parameters:

Name	Type	Description
value	Number	进度值

setVisible(visible)

设置组件是否可见

Parameters:

Name	Type	Description
visible	Boolean	组件是否可见

Inherited From:

• ht.ui.View#setVisible

setWidth(width)

设置组件的宽度

Parameters:

Name	Type	Description
width	Number	组件宽度

Inherited From:

• ht.ui.View#setWidth

setX(x)

设置组件的 x 坐标

Parameters:

Name	Type	Description
x	Number	x 坐标

Inherited From:

• ht.ui.View#setX

setY(y)

设置组件的 y 坐标

Parameters:

Name	Type	Description
y	Number	y 坐标

Inherited From:

• ht.ui.View#setY

setZIndex(zIndex)

设置组件的堆叠顺序

Parameters:

Name	Type	Description
zIndex	Number	堆叠顺序

Inherited From:

• ht.ui.View#setZIndex

setZoom(zoom)

设置缩放

Parameters:

Name	Type	Description
zoom	Number	缩放值

Inherited From:

• ht.ui.View#setZoom

setZoomAnchor(anchor)

设置缩放锚点

Parameters:

Name	Type	Description
anchor	Array	横向和纵向锚点数组，如右上角为：[1, 0]

Inherited From:

• ht.ui.View#setZoomAnchor

showPopover()

显示弹框组件

Inherited From:

• ht.ui.View#showPopover

tearDownBorder(border, x, y, width, height, dom)

卸载边框；只有 CSS 类型的边框才需要此函数

Parameters:

Name	Type	Argument	Description
border	ht.border.Border		边框对象
x	Number	<optional>	起点 x 坐标
y	Number	<optional>	起点 y 坐标
width	Number	<optional>	宽度
height	Number	<optional>	高度
dom	HTMLElement	<optional>	指定绘制的目标 DOM

Inherited From:

• ht.ui.View#tearDownBorder

ump(listener, scope)

删除属性事件变化监听器，removePropertyChangeListener 的缩写

Parameters:

Name	Type	Argument	Description
listener	function		监听器函数
scope	Object	<optional>	函数域

Inherited From:

• ht.ui.View#ump

validate()

重绘组件；此函数负责重新布局组件 DOM、设置层叠关系、加载需要的图片资源、派发 validate 事件等 如果自定义组件，不要重写此函数，而是重写 validateImpl 函数

Inherited From:

• ht.ui.View#validate

See:

• validateImpl

validateImpl(x, y, width, height)

绘制组件内容；如果自定义组件，一般要重写此函数，通过 getRootContext() 获取画笔然后绘制

Parameters:

Name	Type	Description
x	Number	内容范围的 x 坐标
y	Number	内容范围的 y 坐标
width	Number	内容范围宽度
height	Number	内容范围高度

Inherited From:

• ht.ui.View#validateImpl