Progress Indicators
The MDC Progress Indicator component exposes common foundation and component interfaces for a progress indicator. Components that implement these interfaces include linear progress and circular progress. Material Design progress & activity requirements.
Installation
npm install @material/progress-indicator
Basic Usage
MDCProgressIndicatorFoundation API
MDC Progress Indicator Foundation exposes the following methods:
Method Signature | Description |
---|---|
setDeterminate(value: boolean) => void |
Toggles the component between the determinate and indeterminate state. |
isDeterminate() => boolean |
Whether or not the component is in determinate state. |
setProgress(value: number) => void |
Sets the progress to this value. Value should be between [0, 1]. |
getProgress() => number |
The current progress value in the interval [0,1]. |
open() => void |
Puts the component in the open state. |
close() => void |
Puts the component in the closed state. |
isClosed() => boolean |
Whether or not the progress indicator is closed. |
MDCProgressIndicator Component API
MDC Progress Indicator exposes the following API:
Method Signature | Description |
---|---|
determinate: boolean |
Whether the indicator is in the determinate or indeterminate state. |
progress: number |
The current progress. Value should be between [0, 1]. |
open() => void |
Puts the component in the open state. |
close() => void |
Puts the component in the closed state. |