进度条
提供有关用户完成特定操作的进度的直观表示。
“进度条”视图的直观显示使用户能够立即了解已完成多少个选项卡、页面或输入字段。 它最常用作 Web 表单或选项卡上的标题。
配置属性
在“配置”下，设置或修改视图的外观和行为属性。 在“事件”下，设置公式配置属性。
- 屏幕大小
- 在属性名称旁边具有 "屏幕大小" 图标
的配置属性对于每个屏幕大小可以具有不同的值。 如果您未设置值，那么屏幕大小会继承下一个更大的屏幕大小值来作为其缺省值。
- 主题定义
- 主题定义指定视图的颜色和样式，并确定视图的外观。 您可以在主题编辑器中预览视图的外观。 请参阅 主题。
下表中显示了“进度条”视图的外观配置属性：
| 外观配置属性 | 描述 | 数据类型 |
|---|---|---|
| 颜色样式 | 指定进度条填充色的颜色样式。 颜色与所指定主题中的变量相对应。 缺省颜色样式为缺省（灰色）。 | TooltipColorStyle |
| 加斑马条纹 | 如果选中此选项，那么将向进度条添加条纹。 | Boolean |
| 活动 | 如果选中此选项并选中带条纹，那么会使进度条的条纹移动。 | Boolean |
| 范围 | 指定进度条拐角的圆度，以像素或 em 为单位。 例如， 15px 或 1em。 如果仅指定了数字而未指定任何单位，那么会将该数字解释为像素数。 缺省情况下，没有指定边框半径。 |
String |
| 宽度 |
指定进度条的宽度，以像素、百分比或 em 为单位。 例如: 800px， 80% 或 50em。 如果仅指定了数字而未指定任何单位，那么会将该数字解释为像素数。 | String |
| 高度 |
指定井的高度，以像素或 em 为单位。 例如， 15px 或 1em。 如果仅指定了数字而未指定任何单位，那么会将该数字解释为像素数。 缺省情况下，没有指定高度。 | String |
下表中显示了“进度条”视图的行为配置属性：
| 行为配置属性 | 描述 | 数据类型 |
|---|---|---|
| 最大值 | 指定进度的总数字值（不要与宽度混淆）。 例如，100。 | Integer |
示例
在此示例中，为“进度条”视图设置了以下配置属性：
- 行为配置属性：
- 最大值 设置为 100。
- 外观配置属性：
- 颜色样式 设置为 Info。
- 选择了 条带分割 。
- 选择了 活动 。
- 半径 设置为 1。
- 宽度 设置为 25%。
- 事件配置属性：
- 对于装入时事件，使用
setProgress方法将进度条设置为 50：me.setProgress(50);
- 对于装入时事件，使用
这些属性及其值将生成一个具有圆角且宽度为 25% 页宽的浅蓝色带条带动画半填充进度条。
事件
在“事件”属性中设置或修改该视图的公式配置属性和事件处理程序。 可以将事件设置为以编程方式或在用户与该视图交互时触发。 有关如何定义和编码事件的信息，请参阅 用户定义的事件。下表中显示了“进度条”视图的公式配置属性：
| 公式配置属性 | 描述 | 数据类型 |
|---|---|---|
| 公式 | 用于计算进度的表达式。 有关公式的更多信息，请参阅 公式。 |
String |
“进度条”视图具有以下类型的事件处理程序：
- On load：页面装入时激活。
- On click: 在单击进度条时激活。
方法
以下方法可用于该视图：
setWidth()：设置进度条的宽度。getWidth()：获取进度条宽度的已配置大小（包括单位）。setHeight()：设置进度条的高度。getHeight()：获取进度条高度的已配置大小（包括单位）。setColorStyle()：设置进度条的颜色样式。setRadius()：设置进度条的半径（圆度）。setProgress()：设置进度状态。getProgress()：获取进度状态。setMaximum()：设置进度条的最大值。
有关如何使用这些方法的更多信息，请参阅 进度条 JavaScript API 。
其他资源
有关如何创建 Coach 或页面的信息，请参阅 构建 Coach。
有关标准属性 (常规， 配置， 定位， 可视性和 HTML 属性) 的信息，请参阅 查看属性。