ion-progress-bar
进度条（Progress bar）通知用户正在进行的进程的状态，例如加载应用、提交表单或保存更新。有两种类型的进度条：determinate（确定）和 indeterminate（不确定）。
确定模式
确定是默认类型。当知道操作的百分比时 应使用此模式。进度通过设置 value 属性来表示。这可用于显示进度从 0 增加到轨道的 100%。
缓冲
如果设置了 buffer 属性，将显示一个带有动画圆圈的缓冲流以指示活动。buffer 属性的值也将通过可见轨道的多少来表示。如果 buffer 的值小于 value 属性，则不会有可见轨道。如果 buffer 等于 1，则缓冲流将被隐藏。
不确定模式
当不知道进程需要多长时间时，应使用不确定类型。进度条不依赖于 value，而是沿着轨道持续滑动，直到进程完成。
工具栏中的进度条
主题
颜色
CSS 自定义属性
CSS 阴影部分
属性
buffer
| 说明 | If the buffer and value are smaller than 1, the buffer circles will show. The buffer should be between [0, 1]. |
| 属性 | buffer |
| 类型 | number |
| 默认值 | 1 |
color
| 说明 | The color to use from your application's color palette. Default options are: "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", and "dark". For more information on colors, see theming. |
| 属性 | color |
| 类型 | "danger" ｜ "dark" ｜ "light" ｜ "medium" ｜ "primary" ｜ "secondary" ｜ "success" ｜ "tertiary" ｜ "warning" ｜ string ｜ undefined |
| 默认值 | undefined |
mode
| 说明 | The mode determines which platform styles to use. 这是一个虚拟属性，在初始化时设置一次，之后更改其值不会更新组件。 |
| 属性 | mode |
| 类型 | "ios" ｜ "md" |
| 默认值 | undefined |
reversed
| 说明 | If true, reverse the progress bar direction. |
| 属性 | reversed |
| 类型 | boolean |
| 默认值 | false |
type
| 说明 | The state of the progress bar, based on if the time the process takes is known or not. Default options are: "determinate" (no animation), "indeterminate" (animate from left to right). |
| 属性 | type |
| 类型 | "determinate" ｜ "indeterminate" |
| 默认值 | 'determinate' |
value
| 说明 | The value determines how much of the active bar should display when the type is "determinate". The value should be between [0, 1]. |
| 属性 | value |
| 类型 | number |
| 默认值 | 0 |
事件
该组件没有可用的事件。
方法
该组件没有可用的公共方法。
CSS 阴影部分
| Name | 说明 |
|---|---|
progress | The progress bar that shows the current value when type is "determinate" and slides back and forth when type is "indeterminate". |
stream | The animated circles that appear while buffering. This only shows when buffer is set and type is "determinate". |
track | The track bar behind the progress bar. If the buffer property is set and type is "determinate" the track will be the width of the buffer value. |
CSS 自定义属性
| Name | 说明 |
|---|---|
--background | Background of the progress track, or the buffer bar if buffer is set |
--buffer-background | DEPRECATED, use --background instead |
--progress-background | Background of the progress bar representing the current value |
插槽
该组件没有可用的插槽。