组件/数据展示

EProgress 进度条

import EUI 1.0

示例与代码

百分比、色阶、条纹和不确定进度

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 Column { spacing: 20 width: parent.width EProgress { width: Math.min(500, parent.width) height: 20 percentage: 68 showText: true striped: true stripedFlow: true color: [{ color: "#E6A23C", percentage: 30 }, { color: "#409EFF", percentage: 70 }, { color: "#67C23A", percentage: 100 }] } EProgress { width: Math.min(500, parent.width) height: 10 indeterminate: true duration: 1800 } }

效果

运行代码，体验组件交互

可修改文字、属性和事件，再点击运行。

代码在当前浏览器中运行 许可

进度条

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 Column { spacing: 16 width: parent.width EProgress { value: 0.25 width: Math.min(parent.width, 560) } EProgress { value: 0.5 styleType: EStyle.Warning width: Math.min(parent.width, 560) } EProgress { value: 0.76 styleType: EStyle.Success width: Math.min(parent.width, 560) color: EPaletteManager.ThemePalette.fetchColorForStyle(EStyle.Success) } }

效果

运行代码，体验组件交互

可修改文字、属性和事件，再点击运行。

代码在当前浏览器中运行 许可

属性

属性说明取值与默认值

colorvar

自定义颜色；透明值通常表示使用当前主题或语义配色。

默认值动态绑定

contentalias

内容插槽；直接在组件内部声明 QML 子对象。

默认值别名：customText.data

durationint

动画或显示持续时间，单位为毫秒；组件的绑定表达式给出实际用途。

默认值3000

enabledbool

是否允许交互；false 时控件禁用。

默认值true

formatvar

显示格式；日期时间使用格式串，进度可使用函数，倒计时使用时间占位符。

默认值null

heightreal

组件尺寸，单位为像素；可绑定父布局尺寸。

默认值implicitHeight

indeterminatebool

显示不确定进度动画或读取半选状态。

默认值false

percentagevar

百分比进度，范围 0～100；设置后优先于 value。

0–100
undefined：使用 value

默认值undefined

showTextbool

显示进度或评分文字。

默认值false

statusstring

进度的语义状态，空值表示正常。

"" / "success"
"warning" / "exception"

默认值""

stripedbool

显示进度条条纹。

默认值false

stripedFlowbool

让进度条条纹流动。

默认值false

strokeLinecapstring

进度线两端的外形。

"round" / "butt"

默认值"round"

strokeWidthint

边框、分隔线或进度轨道的线宽，单位为像素。

默认值6

styleTypeint

语义配色风格。

EStyle.Default
EStyle.Primary
EStyle.Success
EStyle.Info
EStyle.Warning
EStyle.Danger

默认值EStyle.Primary

textInsidebool

把进度文字放在进度条内部。

默认值false

valuevar

归一化进度值，范围 0～1；percentage 非负时优先使用 percentage。

0–1

默认值0

visiblebool

是否显示组件。

默认值true

widthreal

组件尺寸，单位为像素；可绑定父布局尺寸。

默认值implicitWidth

displayTextstring只读

经过格式化、进度或徽章规则处理后的显示文字。

默认值由运行时计算

effectiveColorcolor只读

根据主题、当前状态及自定义配色确定的实际颜色。

默认值由运行时计算

effectiveStyleint只读

进度状态对应的实际 EStyle 配色。

EStyle.Default
EStyle.Primary
EStyle.Success
EStyle.Info
EStyle.Warning
EStyle.Danger

默认值由运行时计算

normalizedValuereal只读

归一化到有效范围内的进度值。

0–1

默认值由运行时计算