进度追踪器 (可应用主题)
进度追踪器小组件可用于将复杂布局分割为多个视图。可使用此小组件将工作流分割为线性步骤，进而简化复杂流程。进度追踪器中的每一步均可显示一个整合了多个独立小组件的内置混搭。可使用内置混搭小组件显示当前步骤编号的特定混搭。当前步骤处于突出显示状态时，用户可在各步骤之间进行导航，从而更加轻松地了解某一表单或流程的进展。
数据格式
必须创建一个其中包含表示步骤数据结构的字段定义的信息表。信息表必须包括步骤编号、标签和关联混搭的字段定义。下表列出了信息表的数据格式：
|
步骤编号
|
步骤标签
|
步骤混搭名称
|
步骤交互
|
步骤状态
|
|
|---|---|---|---|---|---|
|
字段定义
|
StepNumber: {name: 'StepNumber', baseType: 'NUMBER'}
|
StepLabel: {name: 'StepLabel', baseType: 'STRING'}
|
StepMashupName: {name: 'StepMashupName', baseType: MASHUPNAME'}
|
StepInteracive: {name: 'StepInteracive', baseType: 'BOOLEAN'}
|
StepState: {name: 'StepState', baseType: 'STRING'}
|
|
作用
|
定义步骤编号。
|
定义步骤标签。
|
定义与步骤关联的混搭名称。
|
定义步骤的交互状态。
|
定义步骤状态。选项：Complete、Inactive、Current、Error。
|
|
基本类型
|
NUMBER
|
STRING
|
NUMBER
|
BOOLEAN
|
STRING
|
|
行示例
|
StepNumber: 1
|
StepLabel: 'Step 1'
|
StepMashupName: 'Mashup1'
|
StepInteractive: true
|
StepLabel: 'current'
|
下图显示了 y 轴上具有四个字段定义的信息表所返回数据的示例：
将进度追踪器小组件添加至混搭
1. 将进度追踪器添加至布局中的空容器。
2. 将内置混搭添加至第二个容器。
3. 在“数据”面板上，将所返回信息表的 All Data 属性绑定至小组件的 Data 属性。
4. 在“属性”面板上，配置以下属性：
◦ StepNumberField - 选择步骤编号的信息表列。
◦ StepLabelField - 选择步骤标签的信息表列。
◦ StepMashupNameField - 选择混搭名称的信息表列。确保混搭名称真实存在。
◦ StepInteractiveField - 选择用于指定步骤是否可交互的信息表列。
◦ StepStateField - 选择用于指定当前步骤的信息表列。
5. 或者，将 IsInteractive 小组件属性设置为 True，以允许用户通过单击步骤标签在各步骤之间进行导航。
6. 将 CurrentStepMashup 小组件属性绑定到内置混搭小组件的 Name 属性。
7. 单击“保存”，然后单击“查看混搭”。
运行时，将显示与当前步骤关联的混搭。
启用交互步骤
在默认情况下，运行时并不支持用户与步骤的交互操作。要支持在步骤间的导航操作，必须在混搭中使用来自小组件或服务的事件。例如，可添加允许用户移至下一步或上一步的按钮。
可通过单击步骤标签启用 IsInteractive 属性，以便用户能够在运行时于步骤间进行导航。此外，该操作还允许用户以随机顺序在步骤之间进行导航。下图为交互式进度追踪器。
小组件属性
属性名称 | 说明 | 基本类型 | 默认值 | 绑定 | 本地化 |
|---|---|---|---|---|---|
CurrentStepMashup | 检索当前步骤的混搭名称。 | STRING | 不适用 | Y | N |
CurrentStepNumber | 在运行时设置或检索当前步骤编号。 | NUMBER | 不适用 | Y | N |
Data | 信息表数据源，用于定义要在小组件上显示的步骤。 | INFOTABLE | Y | N | |
ErrorStateIcon | 用于指定：当无法加载进度追踪器数据时，所显示的图标。 | MEDIALINK | error | Y | N |
ErrorStateText | 用于指定：当无法加载进度追踪器数据时，所显示的文本。 | STRING | [[ProgressTracker.unableToLoadData]] | Y | Y |
IsInteractive | 用于指定：步骤是否可交互。 | BOOLEAN | False | Y | N |
MinStepSpacing | 用于设置：对于进度追踪器中的步骤，其水平分隔线的最小长度。 | NUMBER | 90 | N | N |
NoBindingIcon | 用于指定：当进度追踪器未绑定到数据源时，所显示的图标。 | MEDIALINK | bind | N | N |
NoBindingText | 用于指定：当进度追踪器未绑定到数据源时，所显示的文本。 | STRING | [[ProgressTracker.noDataToDisplay]] | N | Y |
NoDataIcon | 用于指定：当进度追踪器数据不包含任何步骤时，所显示的图标。 | MEDIALINK | not visible | Y | N |
NoDataText | 用于指定：当进度追踪器数据不包含任何步骤时，所显示的文本。 | STRING | [[ProgressTracker.noStepData]] | Y | Y |
SelectedData | 信息表，用于表示选定步骤的数据。 | INFOTABLE | Y | N | |
StepClicked | 可绑定事件，在单击步骤时触发。 | 事件 | Y | N | |
StepInteractiveField | 用于指定：控制步骤是否可交互的信息表字段。 | 信息表字段 | N | N | |
StepLabelField | 用于指定：包含步骤标签的信息表字段。 | 信息表字段 | N | N | |
StepMashupNameField | 用于指定：各个步骤所显示的混搭对应的信息表字段。 | 信息表字段 | N | N | |
StepNumberField | 用于指定：包含步骤编号的信息表字段。 | 信息表字段 | N | N | |
StepSize | 用于设置：步骤图标的大小。选项：“小”、“中”、“大” | STRING | “中” | Y | N |
StepStateField | 用于指定：定义步骤状态的信息表字段。 | 信息表字段 | N | N | |
TabSequence | 设置当用户按 Tab 键时小组件的突出显示顺序。 | NUMBER | 0 | N | N |
Height | 用于设置：将小组件添加到固定大小的容器时，小组件的高度。 | NUMBER | 90 | N | N |
Width | 用于设置：将小组件添加到固定大小的容器时，小组件的宽度。 | NUMBER | 600 | N | N |