ProgressBar
ProgressBar
开放Beta测试文档 作为预发布开放Beta测试的一项内容,亚马逊提供了此技术文档。随着亚马逊收到反馈并对功能进行迭代,所描述的这些功能可能会发生变化。有关最新功能的信息,请参阅最新的发布说明。
Progress Bar组件显示进度条以示出正在进行的活动。未定义时,进度条显示不确定的指示器。
用法
导入
import { ProgressBar } from '@amazon-devices/kepler-ui-components';
示例
<ProgressBar
progress={50}
size={"xl"}
/>
属性
| 属性 | 类型 | 默认值 | 是否必需 | 描述 |
|---|---|---|---|---|
progress |
数字 | (不适用) | 否 | 从0到100的数字,表示进度百分比。如果未定义,则显示不确定的进度指示器。 |
animationDuration |
数字 | 确定时为250毫秒,不确定时为1000毫秒 | 否 | 进度动画的持续时间,以毫秒为单位 |
indicatorColor |
ColorValue | 由主题决定 | 否 | 进度指示器的颜色 |
trackColor |
ColorValue | 由主题决定 | 否 | 进度轨道(容器)的颜色 |
size |
SizeVariantAll |
"md" |
否 | 进度条的大小。支持'xs'、'sm'、'md'、'lg'、'xl'、'xxl' |
barStyle |
ViewStyle | 由主题决定 | 否 | 进度条(也称为轨道或容器)的样式覆盖项 |
indicatorStyle |
ViewStyle | 由主题决定 | 否 | 指示器的样式覆盖项 |
自定义
可以使用以下属性自定义进度条:progress、animationDuration、indicatorColor、trackColor、size、barStyle、indicatorStyle和rtl。
主题支持可用,目前适用于组件的borderRadius、height、width和backgroundColor样式。
交互性
| 模态 | 是否可用 |
|---|---|
| 方向键 | 否 |
| 触摸 | 否 |
| 语音 | 否 |
无障碍功能
| 属性 | 是否可用 |
|---|---|
accessible |
是 |
accessibilityRole |
是 |
accessibilityLabel |
是 |
accessibilityValue |
是 |
accessibilityActions |
否 |
accessibilityState |
否 |
用户界面体验
确定
本视频演示了确定进度条。
不确定
本视频演示了不确定进度条。
切换
本视频演示了在运行时于不确定和确定指示器之间动态切换的流程。
Last updated: 2026年6月23日

